数据更改时重新加载 igx 网格答案

【问题标题】：Reload igx grid when data is changed数据更改时重新加载 igx 网格
【发布时间】：2021-09-10 14:10:48
【问题描述】：

我在对话框中有一个 igx 网格。我使用数组posts 作为网格的数据。这个数组的值可以通过程序改变。如何使用数组 posts 的最后一个值更新网格数据？

<igx-dialog #dialog>
  <igx-grid #grid1
            [emptyGridMessage]="'The grid is empty'"
            width="1200px"
            [data]="posts"
            height="600px"
            style="margin: auto"
            [primaryKey]="'person'">
    <igx-column field="person" dataType="string" header="PersonId"></igx-column>
    <igx-column field="name" dataType="string" header="Name"></igx-column>
  </igx-grid>
</igx-dialog>

附：我正在使用 C#。

【问题讨论】：

标签： angular infragistics ignite-ui ignite-ui-angular igx-grid

【解决方案1】：

当组件端的数据发生变化时，您可以在网格上调用markForCheck()，这将强制网格运行更改检测并显示更新的数据。

例如component.ts:

@ViewChild('grid1')
public grid: IgxGridComponent;

public dataChanged() {
  // logic for posts to be assigned a new value
  this.grid.markForCheck();
}

【讨论】：

非常感谢！你又帮了我:)
是否可以标记更改的单元格？例如。通过改变行或单元格的背景颜色？
这不是开箱即用的。看看这些示例：infragistics.com/products/ignite-ui-angular/angular/components/… 基本上，单元格模板中有不同的样式，这些样式会根据值阈值而变化，但是当单元格值发生变化时，我们没有任何东西，除非在通过网格的编辑场景中，它不是你要找的。span>

【解决方案2】：

如果您只是将新项目推送到基础数据，请记住这不会更改其引用。对于立即刷新，可以使用网格 API 方法添加行，而不是直接推送到数据源。当推送到数据源时，网格将在下一个变化检测生命周期刷新，或者数据数组可以像这样改变：

this.data = [...this.data, newItem]; // instead of push

这是必需的，因为网格使用 OnPush 策略并且不会被通知更改（因为数据数组是相同的），因此它会在下次触发更改检测时更新，或者在 Konstantin 的情况下建议，通过调用 grid.markForCheck()。

【讨论】：