Данные поступили поздно угловой в другой компонент - PullRequest
Новая
       5

Данные поступили поздно угловой в другой компонент

0 голосов
/ 29 августа 2018

Я использую Angular 6 и Firebase в качестве бэкэнда. Я получаю данные от пользователя и сохраняю их в локальном хранилище, страница входа перенаправляет в профиль пользователя. В полях ничего не отображается, потому что данные поступают поздно. Сделка происходит после загрузки страницы. Я не могу давать обещания тем, что вызов данных производится во время подключения, а не на странице профиля.

SigninComponent.ts 

onSubmit() {
    const email = this.siginForm.get('email').value;
    const password = this.siginForm.get('password').value;

    this.authService.signInUser(email, password).then(
      () => {
        firebase.auth().onAuthStateChanged((user) => {
          if (user) {
             var ref = firebase.database().ref('users/' + user.uid).on('value', 
                 (data) =>
                localStorage.setItem("userInfo", JSON.stringify(data.val()))

            );
          }
        });      
        this.router.navigate(['Acceuille']);
      },
      (error) => {
        this.errorMessage = error;
      }
    );
}

1 Ответ

0 голосов
/ 29 августа 2018

вы должны поставить эту строку "this.router.navigate (['Acceuille']);" внутри метода firebase.auth (). onAuthStateChanged () после проверки пользователя в блоке if; 

this.authService.signInUser(email, password).then(
  () => {
    firebase.auth().onAuthStateChanged((user) => {
      if (user) {
         var ref = firebase.database().ref('users/' + user.uid).on('value', 
             (data) =>
            localStorage.setItem("userInfo", JSON.stringify(data.val()));
            this.router.navigate(['Acceuille']); // navigation should be here
        );
      }
    });      
          },
  (error) => {
    this.errorMessage = error;
  }
);

Поскольку onAuthStateChange ожидает, пока наблюдатель не дождется разрешения getRedirectResult. Узнайте, как получить зарегистрированного пользователя в этом документе

...