如何在Angular中清除选择元素中的过滤器

How to clear the filter in a select element in Angular?

本文关键字:元素 过滤器 选择 清除 Angular      更新时间:2023-09-26

我有以下HTML:

<select ng-options="mark.id as mark.name for mark in marks" ng-model="markSearch.mark.id">
    <option value="">-- Choose mark --</option>
</select>
...
<tr ng-repeat-start="pipeType in pipeTypes | filter:markSearch">

我想根据标记的选定选项过滤pipeType对象。每个pipeType对象都有一个由id和name两个字段组成的标记对象。我希望在选择"--选择标记--"选项时能够清除过滤器。但是,当我单击"--Choose mark--"选项时,没有任何pipeType对象可见。当这种情况发生时,我想可视化所有对象。我应该更改代码中的哪些内容?

编辑:这是砰的一声。

编辑2:我已经接受了马索的答案,它起作用了。万一其他人想知道为什么它有效,我想这个简短的解释(取自这个答案的评论)会澄清你的想法。

对于数组中的每个元素,Angular将调用comparator函数,并按预期传递"markSearch",将元素传递为"actual"。所以我们说,如果期望的或"markSearch"为空,那么匹配所有元素(返回true)。否则,执行"严格"对象比较

您可以实现自己的比较器函数。

我把你的屁股叉在这里应该还可以。

基本上,您应该向filter : expression : comparatorFn添加一个参数,该函数应该在控制器的作用域中可用。

更新:记得检查angular文档中的过滤器!