Angular mat-selection-list与搜索输入无法正常工作

Question

使用angular5项目，我正在使用角度材质选择列表，该列表无法正常工作，顶部有输入文本搜索。

这是stackblitz上的代码。 https://stackblitz.com/edit/angular-i3pfu2-xgembc

步骤：

1. 从列表中选择说“Sneakers”和“Moccasins”
2. 搜索文字说“clo”
3. 从输入框中删除文字。
4. 参见选择列表，先前选择的选项会自动取消选择，这不应该发生。

我们如何保留列表中先前选择的选项？提前谢谢。

Answer 1

您可以简单地将typesOfShoes字符串数组扩展为具有所选属性的对象数组，并自行处理逻辑。

{"Boolean IsMatch(System.String)"}

我不知道材质mat-selection-list组件是如何工作的，但我确定你知道如何使用（click）指令来改变shoe.selected：（shoe.selected =！show.selected）< / p>

修改

为了完整性：

typesOfShoes = [{name:'Boots',selected:false}, {name:'Clogs',selected:false}, {name:'Loafers',selected:false}, {name:'Moccasins',selected:false}, {name:'Sneakers',selected:false}];