Bonjour à tous,

Je suis un cours Angular.

Mon application compile sans problème mais j'ai une erreur lorsque je souhaite créer un utilisateur.
Je vous joint les différentes partie de mon code pour plus d'informations.

Un grand merci d'avance pour votre aide !


------------ ERREUR

Nom : Capture.PNG Affichages : 478 Taille : 19,9 Ko


------------ APP COMPONENT

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
import { Component } from '@angular/core';
 
import { initializeApp } from "firebase/app";
 
@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent {
 
  constructor(){
    // Your web app's Firebase configuration
    const firebaseConfig = {
      apiKey: "AIzaSyAaOWtE1wIsDUEZTxMZxAd-KvCgaRyMybs",
      authDomain: "wib-library.firebaseapp.com",
      projectId: "wib-library",
      storageBucket: "wib-library.appspot.com",
      messagingSenderId: "171730683518",
      appId: "1:171730683518:web:69a51b5c96c94c76f4fa2f"
    };
    // Initialize Firebase
    const app = initializeApp(firebaseConfig);
  }
 
}

------------ AUTH SERVICE

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
import { Injectable } from '@angular/core';
 
import firebase from 'firebase/compat/app';
import 'firebase/compat/auth';
 
 
@Injectable({
  providedIn: 'root'
})
export class AuthService {
 
  constructor() {}
 
  createNewUser(email:string, password:string){
    return new Promise(
     (resolve,reject)=>{
        console.log('createNewUser 0');
        firebase.auth().createUserWithEmailAndPassword(email, password).then(
          (promesse)=> {
            console.log('createNewUser 1 ' + promesse);
            resolve(promesse);
          },
          (error)=> {
            console.log('createNewUser 2 ' + error);
            reject(error);
          }
        ); // -- FIN THEN
      }
    );
  }
 
 
  signInUser(email:string, password:string){
    return new Promise(
      (resolve,reject) =>{
        firebase.auth().signInWithEmailAndPassword(email, password).then(
          (promesse)=>{
            resolve(promesse);
          },
          (error)=>{
            reject(error);
          }
        );
      }
    )
  }
 
  signOutUser(){
    firebase.auth().signOut();
  }
 
}
------------ SIGNUP COMPONENT -- onSubmit() méthode appelée depuis le template HTML

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
import { Component, OnInit } from '@angular/core';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { Router } from "@angular/router";
import { AuthService } from "../../services/auth.service";
 
 
@Component({
  selector: 'app-signup',
  templateUrl: './signup.component.html',
  styleUrls: ['./signup.component.scss']
})
export class SignupComponent implements OnInit {
 
  signUpForm!:FormGroup; //!: = on force non null / non undefined
  errorMessage:string="";
 
 
  constructor(private formBuilder:FormBuilder,
              private authService:AuthService,
              private router:Router) { }
 
  ngOnInit() {
    this.initForm();
  }
 
  initForm(){
    this.signUpForm = this.formBuilder.group({
      email:['', [Validators.required, Validators.email]],
      password:['',[Validators.required, Validators.pattern(/[0-9a-zA-Z]{6,}/)]]
    });
  }
 
  onSubmit(){
    const email = this.signUpForm.get('email')!.value;
    const password = this.signUpForm.get('password')!.value;
    this.authService.createNewUser(email, password).then(
      ()=>{
        this.router.navigate(['books']);
      },
      (error)=>{
        this.errorMessage=error;
      }
    );
  }
 
}