* ng对于直到单击才更新

时间:2019-02-07 02:33:09

标签: angular typescript

我用* ngFor创建了一个表,该表显示来自Web请求的数据。这是模板代码:

...
  <tr *ngFor="let task of tasks">
    <td>{{task.ID}}</td>
    <td><a (click)="openTaskArea(task.TaskType0.ID)" class="viewLink">{{task.TaskType0.Title}}</a></td>
    <td><a (click)="editTask(task.ID)" class="viewLink"></a></td>
    <td><a (click)="openTask(task.ID)" class="viewLink">{{task.Title}}</a></td>
    <td>
      <ng-container *ngIf="task.AssignedTo">{{task.AssignedTo.Title}}</ng-container>
    </td>
  </tr>
...

此Web请求在加载时以及在关闭允许创建新项目的模式时触发。

以下是获取此数据的函数:

getTasks() {
this.http.get(`https://example.com/_api/web/lists/getbytitle('Tasks')/items`).subscribe(data => {
  // console.log(data['value'])
  this.tasks = data['value']
  console.log(this.tasks)
})
}

使用以下函数关闭模态时将触发此函数:

(function() {
  this.getTasks();
}).bind(this);

需要绑定this,因为它的上下文已丢失。这是this question的推荐解决方案。

该请求已正确完成,因为我可以登录this.tasks,但是直到我单击表中的链接后,DOM才会更新。

我该如何解决?

1 个答案:

答案 0 :(得分:3)

您可以尝试手动调用 detectChanges 进行渲染,

import { ChangeDetectorRef } from 'angular/core';

constructor(private chRef: ChangeDetectorRef){
}

然后使用:

chRef.detectChanges(); // whenever you need to force update view