在Angular 4中导航后未调用的组件代码

Question

我正在尝试使用Angular 5.0.0实现错误处理程序。

在实现ErrorHandler接口的错误处理程序中，我将当前路由更改为错误组件路由：

router.navigate(['/error'], {queryParams: errorWithContextInfo});

浏览器栏中的URL更改，组件HTML显示，constructor被调用，onInit未被调用，成员变量在视图中不可访问（总是空的，即使它们是是公开的并且有默认值。）

然后，当我点击F5时，错误路由被正确加载，在onInit钩子上的构造函数中更改的所有成员变量都可以在视图中按预期访问。

如何解决此问题？ （在导航后，组件视图中应该可以访问queryParams。）

Answer 1

使用NgZone导航完成后，您可以强制进行更改检测。

在构造函数中注入它：

import {NgZone} from '@angular/core';
import {Router} from '@angular/router';
constructor(private router: Router, private zone: NgZone) {}

然后像这样调用导航动作：

this.zone.run(() => router.navigate(['/error'], {queryParams: params}));

有关详细信息，请参阅Angular 2 ngOnInit not called和this issue。