This.router.navigate не вызывает конструктор компонентов — Angular 5 / AWS Amplify

У меня возникли проблемы с методом входа, который я пытаюсь использовать с AWS Amplify. Он имеет многофакторную аутентификацию, и когда MFA проходит успешно, я пытаюсь перенаправить приложение на другой маршрут/компонент через router.navigate().

Когда я это делаю, конструктор не запускается. Здесь я подписан на Amplify authState с внедрением зависимостей. Он подписывается на authState и вводит информацию о пользователе. Это не работает с начальным успехом и маршрутизацией через router.navigate(). Если я обновляю страницу, все работает нормально, потому что вызывает конструктор.

Я пытался использовать ngZone.run(), но у меня это тоже не сработало. Вот мой код.

Проверка многофакторной аутентификации для входа — компонент входа

submitMFA() {
    console.log(this.mfaCode);
    if (this.mfaType == 'SMS_MFA') {
      Auth.confirmSignIn(this.user,this.mfaCode, 'SMS_MFA')
        .then(user => {
          this.loginSuccess();
        })
        .catch(err => {
          this.loginError(err);
        });
    } else {
      Auth.confirmSignIn(this.user,this.mfaCode, 'SOFTWARE_TOKEN_MFA')
        .then(user => {
          this.loginSuccess();
        })
        .catch(err => {
          this.loginError(err);
        });
    }
  }

  loginSuccess() {
    console.log("Success");
    console.log(this.user);
    this.resetMFA();
    this.router.navigate(['/home']);
  }

Домашний компонент, к которому я пытаюсь перейти:

import { Component, OnInit, NgZone } from '@angular/core';
import { AmplifyService } from 'aws-amplify-angular';
import { Auth } from 'aws-amplify';
var QRCode = require('qrcode');

@Component({
  selector: 'home',
  templateUrl: './home.component.html',
  styleUrls: ['./home.component.css']
})
export class HomeComponent implements OnInit {
  userGroup: string = "none";
  user: any = null
  preferredMFA: string = null;
  totpSetup: boolean = false

  constructor(private amplifyService: AmplifyService, private ngZone: NgZone) {

    this.amplifyService.authStateChange$
      .subscribe(authState => {
        if (authState.state === 'signedIn') {
          this.user = authState.user;
          console.log(this.user);

          if (authState.user.signInUserSession.accessToken.payload["cognito:groups"]) {
            // This sets what group the user is in. Based on this group we set what perspectives will show.  Ex: The 'Administration' link only shows in the nav bar for users in the Admins group
            this.userGroup = authState.user.signInUserSession.accessToken.payload["cognito:groups"][0];
          } else {
            console.log("No usergroup found");
          }

          this.preferredMFA = this.user.preferredMFA;
        }
      });
  }

Вот мой файл routing.ts

import { ModuleWithProviders } from '@angular/core/src/metadata/ng_module';
import { Routes, RouterModule } from '@angular/router';


import { AuthenticationComponent } from './components/authentication/authentication.component';
import { HomeComponent } from './components/home/home.component';
import { NotFoundComponent } from './components/not-found/not-found.component';


export const ROUTES: Routes = [
    {path: '', component: AuthenticationComponent},
    {path: 'home', component: HomeComponent},
    {path: '**', component: NotFoundComponent}
];

export const ROUTING: ModuleWithProviders = RouterModule.forRoot(ROUTES)

person Travis Alexander Terrell    schedule 05.01.2019    source источник


Ответы (1)


Navigate принимает массив строк, а не строку.

this.router.navigate(['/home']);
person Clouse24    schedule 05.01.2019
comment
Я отредактировал это, спасибо. Это не то, что вызывает проблему, хотя я просто написал это неправильно, когда задавал свой вопрос. - person Travis Alexander Terrell; 05.01.2019
comment
вы также должны опубликовать свой файл маршрутов для устранения неполадок - person Clouse24; 05.01.2019
comment
Добавил свой файл routing.ts. Это то, что вы просили? - person Travis Alexander Terrell; 05.01.2019