有什么方法可以知道在primeng multiselect中何时移除芯片？

【问题标题】：Is there any way to know when chip is removed in primeng multiselect?有什么方法可以知道在primeng multiselect中何时移除芯片？
【发布时间】：2022-02-10 19:20:14
【问题描述】：

我正在使用这个https://primefaces.org/primeng/showcase/#/multiselect 和芯片我的字段连接到反应式表单字段，当我使用复选框从选择中选择和取消选择项目时，它可以工作，但是当我在关闭下拉列表时删除芯片时，更改不会反映到动态表单中。我想知道是否有任何事件可以跟踪何时移除带有 X 的芯片，以便我可以将更新后的值修补到表单中？

【问题讨论】：

标签： angular primeng

【解决方案1】：

是a bug，这里是removeChip() function：

removeChip(chip: any) {
    this.value = this.value.filter(val => !ObjectUtils.equals(val, chip, this.dataKey));
    this.updateFilledState();
}

其中onModelChange() 未使用新值调用。

作为一种解决方法（在 PrimeNG 团队修复它之前），您可以手动调用它。首先参考您的多选：

@ViewChild(MultiSelect) ms: MultiSelect;

然后在ngAfterViewInit钩子中扩展removeChip()函数：

ngAfterViewInit() {
  const originalRemoveChip = this.ms.removeChip;
  this.ms.removeChip = (...args) => {
    originalRemoveChip.apply(this.ms, args);
    this.ms.onModelChange(this.ms.value);
  };
}

这里正在工作STACKBLITZ

【讨论】：

谢谢你，我喜欢这个技巧！