Javascript Angular router.redirect不'；t填充变量

我在Angular 5项目中使用Stripe checkout，似乎遇到了路由器重定向/模板生命周期问题

在用户注册时，我打开条带签出模式。当那是一个支付源令牌时，我再做一些API工作，然后做一个router.redirect

stripe.open({
  email: 'foo@foo.com',
  name: 'Subscription',
  description: 'Basic Plan',
  amount: 499,
  token: (source) => {
    this.http.post('/user/subscribe', { source: source.id }).subscribe(_ => {
      this.router.navigate(['stylist/profile']);
    });
  }
});

应用程序正确重定向，但变量不会显示任何内容。下面是我的页面示例。理想情况下，重定向将触发ngOnInit，并且测试变量将为true。在我的场景中，测试在html模板中显示为空白

配置文件路径

{ path: 'stylist/profile', component: ProfilePageComponent, canActivate: [AuthGuard] },

验证保护

@Injectable()
export class AuthGuardService implements CanActivate {
  constructor(
    public auth: AuthService,
    public router: Router,
    public route: ActivatedRoute
  ) {}

  canActivate(): boolean {
    if (!this.auth.isAuthenticated()) {
      this.router.navigate(['']);
      return false;
    }
    return true;
  }
}

个人资料页面组件

export class ProfilePageComponent implements OnInit {
    test: boolean = false;

    ngOnInit() {
       this.test = true;
    }
}

个人资料页面HTML

<div>Test variable: {{test}}</div>

测试变量：{{Test}

这段代码已经简化，但我想确保我没有因为在回调的回调中重定向而丢失任何奇怪的生命周期事件

我尝试过订阅各种

Router

和

ActivatedRoute

事件，但没有任何运气。我也看到过涉及

ngZone

的解决方案，但这些似乎也不符合要求

19年7月1日更新

根据评论中的建议，我通过stackblitz重新创建了这个

在主页初始加载时，您可以单击“打开条带”按钮并填写一些虚拟数据。然后，回调会重定向到

/test

，并在控制台中显示一条警告消息

导航在角度区域外触发，您是否忘记调用“ngZone.run（）”？

---

我相信这会指引我去做

ngZone.run（）

。。。在我的

signup.component.ts中的某个地方，但还不确定在哪里。
如上编辑所述，在函数回调中使用
Router.navigate
从技术上讲是在角度区域之外的

包装我的
路由器。在
NgZone中导航
。运行（（）=>{}）
成功了

实施的解决方案：

import { Component, Input, NgZone } from '@angular/core';

constructor(private zone: NgZone) { }

signup() {
  stripe.open({
    email: 'foo@foo.com',
    name: 'Subscription',
    description: 'Basic Plan',
    amount: 499,
    token: (source) => {
      this.http.post('/user/subscribe', { source: source.id }).subscribe(_ => {
        this.zone.run(() => {
          this.router.navigate(['stylist/profile']);
        });
      });
    }
  });
}

设计师/个人资料是否与您触发它的页面相同？或者它实际上是另一条路由？显示路由声明会有所帮助。@IngoBürk条带片段位于注册组件中，当前显示在主页上。如果我删除条带回调并只进行重定向，它似乎会起作用。一般来说，这应该会起作用，因此在Stackblitz中重现这一点会很有帮助，因为我怀疑您的问题过于简单（或不完整），以至于问题被隐藏。我将尝试在其中重新创建它。我没听说过那种环境！