我正在尝试实现一些非常简单的事情:
显示我的组件中的服务提供的数据。
这就是我曾经有用的东西:
在我的组件中:
...
dataSet: String[];
ngOnInit(){
this._service.getDataId().then(data => this.dataSet = data);
}
...
为我服务:
...
getDataId(){
return this.http.get(adress).toPromise()
.then(response => response.json() as String[])
.catch(this.handleError);
} // return a Promise<String[]>
...
在 View 中:
...
<ul>
<li *ngFor="let data of dataset">
{{ data['id'] }}
</li>
</ul>
...
但现在,我更改了服务功能以获取更多数据。
从那时起,我收到了 ExpressionChangedAfterItHasBeenCheckedError。
这是服务中的更改:
...
getMoreData() {
const result: Map<string, String[]> = new Map();
return this.http.get(this.adress).toPromise()
.then((response) => {
return Promise.all(Array.from(response.json())
.map(id => {
return this.http.get(this.adress + '/' + id').toPromise()
.then((rep) => {
result.set(domain['@href'], rep.json() as String[]);
}).catch(this.handleError)
})
);
})
.then(() => result)
.catch(this.handleError);
} // return a Promise<Map<string, String[]>>
...
即使数据正确显示,也会引发错误。
我尝试了一些解决方法(setTimeout、ChangeDetectorRef),但我什至不知道为什么它有效,但现在不再有效,因为这两个函数都返回 Promise<Stuff>
。
我还知道我需要在组件中像这样初始化我的属性,以避免加载 View 时出现 null 错误:
this.moreData: Map<string, String[]> = new Map();
这也可能会导致我的问题,但是我该怎么办?
---
项目使用
Angular 4.2.2
Typescript 2.3.4
最佳答案
其实和这个问题有关: https://github.com/angular/angular/issues/17725
Map<> 结构是这里的问题,因为每次在 View 中使用它时(例如:使用 .entries 时),它都会创建一个新的迭代器
可以在上面的链接中找到解决方法。
关于javascript - 带有 Promise 的 ngOnInit 上的 ExpressionChangedAfterItHasBeenCheckedError,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44695139/