路由到组件后不会触发Angular OnInit

Question

我刚遇到一个非常奇怪的问题,我以前从未使用过角度路由器.

我正在使用传单插件来显示与我的基础数据集相关的一些地图标记.为了获得有关这些位置的更多详细信息,单击其中一个标记应将用户路由到另一个调用detail的组件,方法是在url(detail/:id)中传递相应的数据集ID .

但是,在这种情况下,将加载组件并调用构造OnInit函数,但实现的函数不会正常触发.那里什么也没发生.

所有这些也可以在这个stackblitz 示例中看到.

这是Angular(6.0.5)当前版本中的已知错误吗？如果是这样,有解决方法吗？

欢呼并提前谢谢

Answer 1

单击标记会在NgZone外部运行逻辑,从而防止发生更改检测.您需要手动运行它.注入NgZone到MapComponent

export class MapComponent {
...
  constructor(private router: Router, private ngZone: NgZone) {...}

然后改变

 marker_label.on('click', (event: MouseEvent) => {
            const link = ['detail', id];
            this.router.navigate(link);
        });

至

marker_label.on('click', (event: MouseEvent) => {
            const link = ['detail', id];
            this.ngZone.run(() => this.router.navigate(link))
        });