如果数据已更改,则不会刷新datagrid中激活的过滤器

时间:2018-07-24 08:30:08

标签: angular vmware-clarity

如果数据已更改,我在重新过滤方面会遇到问题。

请参阅以下堆叠闪电战:https://stackblitz.com/edit/clarity-light-theme-v11-oosuvk

该列用'AA'预先过滤。如果选择一行,则将值更改为“ BB”,该行将保留在数据网格中,因此过滤器尚未“刷新”。

如何实现数据网格检测到更改并对其进行重新过滤?列的值正在刷新,那么为什么不重新过滤呢?

2 个答案:

答案 0 :(得分:0)

也许您应该尝试强制更新clrFilterValue。我设法通过双重绑定clrFilterValue刷新过滤器,并通过一个临时变量在组件中对其进行更新:

在.html中:

<clr-dg-column [clrDgField]="'name' [(clrFilterValue)]="filterValue">Name</clr-dg-column>
[...]
<input #input value="{{selectedItem.name}}">
<button (click)="onSave(input.value)">Save</button>

在.ts中:

public filterValue = 'AA';
onSave(value) {
    this.selectedItem.name = value;
    let tmp = this.filterValue;
    this.filterValue = this.filterValue + ' ';
    setTimeout(
      () => {
          this.filterValue = tmp;
      }, 0
    )
  }
}

但是,我不喜欢使用setTimeout() ...希望能有所帮助。

答案 1 :(得分:0)

执行此操作的最快非黑客方式是由于数据网格不知道的数据更改而在数据网格上调用公共dataChanged()方法来更新显示的项目:{{3 }}

但是,我强烈建议,当您在Datagrid中显示不可变对象时,请使用它们。原因是出于明显的性能问题,数据网格无法在每个更改检测周期内对每个项目执行深层对象比较。它会 检查项目是否已添加或从项目的总体列表中删除,但不会检查其属性是否已更改。这是与*ngFor完全相同的行为,几乎被认为是所有结构指令的标准行为。 在您的情况下,这意味着编辑逻辑将从

更改为
selectedItem.name = name

收件人:

new Item = {...selectedItem, name};
items.splice(selectedItemIndex, 1, newItem);

如果要执行此操作,则无需手动强制更新数据网格。