时间戳

首页 > 解决方案 > Primeng Datatable 4.3：未填充数组更改

angular - Primeng Datatable 4.3：未填充数组更改

问题描述

我正在使用primeng 4.3

我已经编写了这个primeng数据表：

<p-dataTable [value]="quotes" [editable]="true">
  <p-column *ngFor="let col of cols" [field]="col.field 
    [header]="col.header" [editable]="col.editable">
    <ng-template let-col let-quote="rowData" pTemplate="editor">
      <p-spinner size="30" [(ngModel)]="quote[col.field]" name="quote"</p-spinner>
    </ng-template>
  </p-column>
</p-dataTable>

this.quotes更改时出现问题。我的意思是，当在 上填充新数组时this.quotes，数据表不会填充更改。

为了确保填充了一个新数组，我正在使用：

this.quotes = Object.assign([], calculatedQuotes);

所以，我的意思是，每次this.quotes分配时，它都有一个对新数组的新引用。

有任何想法吗？

我正在使用primeng 4.3

标签： angulartypescriptprimengprimeng-datatable

解决方案

正如PRIMENG doc所说：

在某些情况下，例如重新应用排序，更改检测表可能需要知道其值的变化。为了性能起见，只有在值的引用发生变化时才这样做，这意味着使用 setter 而不是 ngDoCheck/IterableDiffers，这会降低性能。因此，当您操作值（例如删除或添加项）时，不要使用 push 等数组方法，而是使用扩展运算符或类似方法 splice 创建新的数组引用。

因此，您查看表格更改的方式是正确的：

this.quotes = Object.assign([], calculatedQuotes);

要将新项目添加到网格中，您可以使用扩展运算符：

this.quotes = [...this.quotes , newObject];

推荐阅读