Angular Сервисная переменная появляется как неопределенная в компоненте - PullRequest
Новая
       183

Angular Сервисная переменная появляется как неопределенная в компоненте

0 голосов
/ 07 августа 2020

У меня есть приложение, которое использует аутентификацию по электронной почте / паролю firebase для входа в систему, и я хочу иметь возможность отображать ошибки аутентификации firebase для пользователя, если они не могут войти в систему. 

AuthError: string;


  login(email: string, password: string) {
    this.firebaseAuth
      .signInWithEmailAndPassword(email, password)
      .then(value => {
        console.log('Nice, it worked!');
        this.navroute.navigate(['home']);
        
      })
      .catch(err => {
        console.log('Something went wrong:',err.message);
        this.AuthError = err.message;

      });
  }

Но когда я назначаю AuthError для другой переменной в моем компоненте входа в систему для отображения пользователю, он становится неопределенным.

Вот раздел из моего компонента входа в систему. Ts 

errorMessage: string;

submit(){
    console.log("login");
    this.email = this.LoginForm.value.inputUsername;
    this.password = this.LoginForm.value.inputPassword;

    if(this.email ==  null || this.password == null){
      this.errorMessage = "Username or password cannot be empty!";
    } else{
      this.authService.login(this.email, this.password);
      this.LoginForm.reset();
      console.log(this.authService.AuthError);
    }
  }//end submit

и консоль, когда пользователю не удается войти в систему, показывает: 

login
undefined
auth.service.ts:48 Something went wrong: The email address is badly formatted.

по какой-то причине this.authService.AuthError не определено в компоненте входа в систему, тогда как вместо этого я бы хотел, чтобы он выполнял отображается то же сообщение, что и сообщение об ошибке в AuthService.

Заранее благодарим и сообщите мне, если потребуется дополнительная информация.

1 Ответ

0 голосов
/ 07 августа 2020

Попробуйте следующее. Значение в this.authService.AuthError будет доступно только после входа в систему, верно? 

  submit(){
        console.log("login");
        this.email = this.LoginForm.value.inputUsername;
        this.password = this.LoginForm.value.inputPassword;
    
        if(this.email ==  null || this.password == null){
          this.errorMessage = "Username or password cannot be empty!";
        } else{
    
          this.authService.login(this.email, this.password).subscribe(data= {
    
     console.log(this.authService.AuthError);
    });
         
         
        }
      }//

end submit
...