Angular 2: http 服务更新后模板未更新

Angular 2: Template not updating after http service update

我仍在努力学习 ng2,所以我确定这是一个常见的菜鸟问题,但我在网上找到的 none 解决方案对我有所帮助。有人知道我的问题是什么吗?

我有一个将 getEventList() 方法作为可观察对象的服务

getEventList(): Observable<any>{
    return this.http.get('./assets/data.json')
        .map(response => response.json());
}

我在我的组件里订阅了它

ngOnInit(){
    this.eventService.getEventList()
        .subscribe(events => {
            this.zone.run(()=>{
                this.events = events;
                console.log(this.events)
            });
        });
}

我的模板只是尝试以 json 格式输出事件变量

<p>
    {{
        events | json
    }}
</p>

如您所见,我在 zone.run() 回调中将事件的值分配给局部变量。仍然没有看到我的模板更新。我也试过 ApplicationRef.tick 和 ChangeDetectorRef.detectChanges() 但似乎都没有检测到我的更改。

Console.log 调用确认数据已更新。在此组件上触发的任何点击处理程序似乎也会更新视图。

有人知道我做错了什么吗?我 post 的代码是否足以获得一些建议?让我知道你还想看什么。

假设您在调用 getEventList() 方法之前没有给 this.events 赋值,这应该可以做到:

<div *ngIf="events">
{{ events | json }}
</div>

种子正在将 ChangeDetectionStrategy 设置为 OnPush。将此设置为默认值解决了我的问题。