Question

鉴于此代码：

ngOnInit() {
    this.apiService.getBlogPosts().subscribe(blogPosts => {
        this.allBlogPosts = blogPosts;

        this.changeDetector.detectChanges();
    }));
}

我想了解为什么我被迫使用this.changeDetector.detectChanges();

情况是，如果我第一次加载我的博客路线，我的帖子就可以正常加载，如果我route到另一个页面（另一个component或同一个＆＃34;博客＆＃ 34; component显示特定帖子的详细信息（例如＆＃39; blog / my-post＆＃39;））然后我route回到＆＃34;博客＆＃34;根目录中的组件（＆＃39;博客/＆＃39;），这次，模板无法使用帖子进行更新。我可以在Inspect，Network标签中看到获取帖子的路线仍在运行，console.log显示所有内容似乎都很顺利，但模板无法更新除非我强制改变检测。这是预期的行为吗？可以补救吗？这看起来很奇怪......

另一件值得注意的事情是，我第一次和第三次访问＆＃34;博客＆＃34; component我使用：

this.router.navigate([`/${url}`]);

导航到它......这对此无济于事......

修改：getBlogPosts()方法位于我注入ApiService的{{1}}中：

BlogComponent

Answer 1

Angular使用NgZone在应该运行更改检测周期时收到通知。 NgZone使用zone.js拦截所有异步操作，例如setTimeout，new Promise，XHR请求等。因此，通常情况下，无需任何其他工作显影剂。

但是，如果某些操作未被zone.js捕获，则不会触发更改检测并且必须手动执行此操作。但您可以使用NgZone在Angular区域中执行某些操作，这意味着Angular将在回调执行完毕后运行更改检测。

所以在你的情况下你可以尝试这样的事情：

this.routerSubject.subscribe((url: string) => { NgZone.run(() => this.router.navigate([/${url}]); });

其中NgZone可以注入任何Angular组件或服务：

constructor(zone: NgZone) {}

angular 2路由订阅变更检测

1 个答案: