打字稿：如何动态更新tablerows表时，对象已更改(Typescript: How to upd

这是我的html代码：

</table>
  <tr *ngFor="let task of taskArray">
    <td>{{task.startTime}}</td>
    <td>{{task.endTime}}</td>
    <td></td>
    <td>{{task.action}}</td>
    <td>{{task.glevel1}}</td>
    <td>{{task.glevel2}}</td>
    <td>{{task.glevel3}}</td>
    <td>{{task.glevel4}}</td>
    <td>{{task.glevel5}}</td>
    <td>{{task.train}}</td>
    <td>{{task.trainType}}</td>
    <td>{{task.wagon}}</td>
    <td>{{task.repeaterWagon}}</td>
    <td>{{task.remark}}</td>
  </tr>
</table>

这是我的TS-代码（I发送对象的地方，我推对象到对象阵列的另一个组件）：

taskArray: Task[] = [];

fillTable(task){
  this.taskArray.push(task);
}

我发射功能fillTable（任务）后，它不会更新表各自不tablerows添加到表中。 好像，我的表改变对象后不更新。 或许这是与我的对象发送到另一个组件。 因为这既不是我的表，也不会为选择或其它HTML对象的工作。

我希望能够更改的对象，进而更新或修改表。

我怎样才能触发餐桌上的更新？

[UPDATE]

我应该提到，我包括在该部件，其中该表就在于这样在我的“父HTML”：

<div id="taskTableDiv" style="width: 98%">
    <app-task-table></app-task-table>
</div>

Answer 1:

试试你把任务分配后的阵列。 更改检测结合是不会发生的，如果你只需要添加一个项目对已经绑定的数组。

 this.taskArray = [new Task()]; 

Answer 2:

fillTable(task){
  this.taskArray.push(task);
  location.reload();
}

Answer 3:

我想回答我的问题，因为我得到了一个解决方案：

我现在使用一种名为任务服务 ：

import { Injectable } from '@angular/core';
import { Task } from './task';

@Injectable({
  providedIn: 'root'
})
export class TaskService {
  taskArray: Task[] = [];

  fillTable(task: Task){
    this.taskArray.push(task);

    console.log(this.taskArray)
  }
}

我启动任务服务像这样在我的我的表成分的TS：

constructor(public taskService: TaskService) { }

我在这同一组件的HTML像这样在我的表体的* ngFor环：

<tbody>
  <tr *ngFor="let task of taskService.taskArray">
.
.
.
  </tr>
</tbody>

而像这样它更新表，因为该服务保持可变，并使之保持最新。

你可以在这里找到这个教程： https://angular.io/tutorial/toh-pt4

文章来源: Typescript: How to update table with dynamic tablerows when object has changed