与存储和HTTP与ngFor
问题描述:
无限循环我有这个代码无限循环: 模板:与存储和HTTP与ngFor
<ng-container *ngFor="let row of service.dataLoadAsync() | async">
服务:
dataLoadAsync(filters: FinishedCallsFilter = {}): Observable<FinishedCall[]> {
return this.httpFinishedCallsObservable(Object.assign({limit: this.limit}, {})).flatMap(response => {
this.store.dispatch(new ReplaceMany(response.items))
return this.store
})
}
我也试过这个功能的实现:
dataLoadAsync(filters: FinishedCallsFilter = {}): Observable<FinishedCall[]> {
this.httpFinishedCallsObservable(Object.assign({limit: this.limit}, {}))
.subscribe(response => this.store.dispatch(new ReplaceMany(response.items)))
return this.store
}
private httpFinishedCallsObservable(params: { limit: number, tag ?: string }) {
return this.http.post(this.apiUrl, params)
.map((json) => this.parseHttp(json))
.do(response => this.tagStore.dispatch(new UpdateTag(response.tag)))
}
所以,这个问题。没有http请求,evferything是好的。但后来我尝试下载数据并更新存储,在循环中函数调用了很多次。 如何修复代码?我想使用存储缓存
答
它实际上不是一个无限循环。
如果您在模板中绑定一个函数,则每次运行角度更改检测时都会调用该函数。
这是一般的不好的做法。相反,将结果分配给一个字段并绑定到该字段。
constructor() {
this.data = service.dataLoadAsync();
}
和
<ng-container *ngFor="let row of service.data | async">
谢谢!这工作! – x1site
很高兴听到:) –
即使使用ChangeDetectionStrategy.OnPush(认为这会阻止?),并将函数绑定到返回'pluck'ed'http.get'响应的模板,也会有同样的问题。订阅http响应并将其分配给属性似乎可行。 – Manolis