angular - 手动触发管道更新

Question

我创建了一个可以使用 *ngFor with objects 的管道。但是，当更新对象时，管道不会更新。我通过将有状态管道与 pure: false 结合使用找到了解决方案 here。

就我的用例的性能而言，此解决方案是 Not Acceptable ，因为它会为每次更改刷新管道(我几乎在任何地方都使用此管道来呈现复杂元素)。

有没有办法触发管道的手动刷新，以便它只在我需要时刷新？

这是一个 plunker - 要查看问题，请尝试通过单击 - 按钮删除名称。如果你添加 pure:false 你会发现它会起作用:

@Pipe({name: 'keys', pure: false})
export class Keys implements PipeTransform {
  transform(value, args:string[]) : any {
    let keys = [];
    for (let key in value) {
      keys.push({key: key, value: value[key]});
    }
    return keys;
  }
}

我想在我的 delName() 函数中添加一些东西，以便它更新管道...

Answer 1

第一种方式:参数

使纯管道变得不纯的一种方法是添加一个parameter给你的Pipe .

当你想刷新时，改变参数即可。

---

第二种方式:不带参数

Pure Pipe 将在其输入有一个新实例时被触发。因此，对于 TypeScript 2.1+，以下代码将使用新实例复制原始对象，并导致纯管道被触发。

    let copy = { ...original }

负面影响

这将强制您的组件在每次变量更改其值时刷新您的管道，即使这不是管道包含的变量

---

堆栈 Blitz

这两种方式都包含在 stackbliz demo中.