Angular11 芯片防止用户输入错误值

Question

我想实现角材料的“芯片组件”。我想使用 chip material with autocomplete，但我想确保在添加之前使用的值存在于给定列表中。

例如在链接中，您只获得了一个水果列表。如何防止用户在列表中输入“具体”（这不是我们这里的水果列表的一部分？）

我不希望验证在“保存”按钮之类的地方，我想从一开始就避免输入错误的值。

这是一个stackblitz from angular without the input verification

非常感谢！ 凯夫'。

Answer 1

在接收新添加值的 add 函数上，检查列表，例如“fruits”当前值是否存在。