Angular 5路由器在google登录回调中无法正常工作

Question

我正在构建具有登录和仪表板以及简单路由的Web应用程序;

我有两个登录选项和路线：

登录选项：

1. 使用电子邮件：

   login(u) {
       this._loginService.login(u)
          .subscribe(data => {
             console.log('Email login successful!');
             this._router.navigate(['/dashboard']);
          });
   

2. 使用google：

   googleLogin() {
   gapi.auth2.authorize({
       client_id: *
       scope: 'email',
       response_type: 'code',
       prompt: 'select_account'
     },
     (response) => {
       if (response.error) {
         return;
       }
       this._loginService.loginWithGoogle(response)
         .subscribe(response1 => {
           console.log('Google login successful!');
           console.log(response);
           this._router.navigate(['/dashboard']);
         });
     });
   

3. 路由器选项：

   const appRoutes: Routes = [ { path: 'dashboard', component: MainComponent}, { path: 'login', component: LoginComponent }

当使用电子邮件登录成功时，路由器会导航并且不会出现任何问题。

问题是，当谷歌登录谷歌登录并且路由器导航到/仪表板时，应用程序会以这种方式崩溃：

1. 如果按下按钮更改路线，则只显示视图，不会从dom中删除我的仪表板。
2. 有时登录页面不会从dom中删除
3. 其他功能在我的代码中不起作用。
4. 在控制台中没有错误

当我重新加载页面时，一切正常。

Answer 1

要解决此问题，请尝试！

constructor(private zone: NgZone) {
    ...
    ...

      this.zone.run(() => {
         this._router.navigate(['/dashboard']);
       });

参考：Angular 2 ngOnInit not called