*ng 直到点击才更新

Question

我创建了一个带有 *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.tasks但是，直到我单击表中的链接才会更新 DOM。

我该如何解决这个问题？

Answer 1

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

import { ChangeDetectorRef } from 'angular/core';

constructor(private chRef: ChangeDetectorRef){
}

然后使用：

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