Angular 2 * ngfor不会使用连续的http请求响应进行更新

我有一个空数组，名为rows，我想用* ngFor来显示它。在数组的每一行上，我传递来自http请求的响应。所有的http请求都被顺序调用。即使数组输入正确，* ngFor也不会更新。我希望在我收到它的请求响应时按顺序显示每一行。Angular 2 * ngfor不会使用连续的http请求响应进行更新

<div class="row" > 
    <my-rows 
     *ngFor="let row of rows | keys; trackBy: trackByFn; let index = index" 
     [month]='row.value' 
     [title]='row.key'> 
    </my-rows> 
</div>

getRerports(url: string, dates: any, id: any){ 
    let params = new URLSearchParams() 
    params.set('company_id',id) 
    params.set('date',dates[0]) 
    this.authHttp.get(this._getReportsUrl,{search:params}) 
     .subscribe(
      data=>{ 
       let formatedDate = moment(data.json().date,'YYYY-MM-DD').format('MMMM YYYY') 
       this.rows[formatedDate] = data.json() 
       dates.splice(0,1) 
       this.flag = false 
       if(dates.length>0){ 
        this.getRerports(this._getReportsUrl,dates, id) 
       }else{ 
        this.flag=true 
       } 
      }, 
      err=> console.log(err) 
     ) 
} 

trackByFn(index:any, item:any) { 
    return index; 
}

来源

2017-04-04 dimitris maf

更多代码请。 – n00dl3

请发布您的http请求的详细信息。 – Pengyy

@ n00dl3我已经添加了http req –

如果不更新使用ChangeDetectorRef视图。

constructor(private ref: ChangeDetectorRef)

更新数组时使用this.ref.detectChanges（）。

来源

2017-04-04 10:02:22 RemyaJ

它似乎不起作用。我已经发布它在阵列更新下。 –

您是否正确地获取了数组中的值？如果它只是未更新的视图，则应该起作用。 – RemyaJ

Yeap数组已正确更新并且所有请求都已成功完成。当我在外部div中使用带有* ngIf的标志变量时，我一次获得所有行。问题是我想要按顺序打印它们。 –

我已经尽力改变我提供的对象行阵列，而不是

this.rows[formatedDate] = data.json()

我已经使用这个：

let object = {key:formatedDate, value: data.json()} 
       this.rows.push(object)

，它似乎工作得很好。所以问题出在数组初始化。

来源

2017-04-11 13:15:26

Angular 2 * ngfor不会使用连续的http请求响应进行更新

回答

相关问题