Question

我是angularjs的新用户，我正在尝试过滤由数组填充的表格。

在表格中：ng-repeat="item in exampleArray | filter: query"

query由两个选项组成：

<select ng-model="query.alpha" ng-options="item for item in alphas">
    <option value="">All</option>
</select>

<select ng-model="query.bravo" ng-options="item for item in bravos">
    <option value="">All</option>
</select>

这一切都很好，除了每个选择中的初始option，意味着选择不应该过滤数组。

看起来这可能是null而不是undefined。我知道以下重置过滤器的方法：$scope.query = {};但这会重置每个过滤器，而不只是一个。

如何在不重置整个过滤器的情况下从一个选择中删除过滤器？

http://jsfiddle.net/wys85kf1/2/

Answer 1

过滤器需要了解query.alpha和query.bravo。

请看一下：

 <tbody>
    <tr ng-repeat="item in items = (exampleArray | filter: query.alpha | filter: query.bravo)">
        <td>{{item.alpha}}</td>
        <td>{{item.bravo}}</td>
        <td>{{item.charlie}}</td>
    </tr>
</tbody>

完整代码可在以下网址获得：

http://jsfiddle.net/wys85kf1/3/

希望它有所帮助。

感谢。

Answer 2

这确实是一个PITA，现在可能有更好的解决方案，

我调整了你的小提琴，向你展示了两种方法来处理这个问题。我也不喜欢，但他们完成了工作。

这是第一种方式：

ng-change='query.bravo = query.bravo ? query.bravo : ""'

将该指令添加到您的模板，准确地添加到<select>。

这是第二种方式，这是使用手表，因为它比以前的方式更加偏好。

$scope.$watch('query.alpha',function (newVal) {
    if (newVal === null) {
        $scope.query.alpha="";
    }
});

行动中：http://jsfiddle.net/SanderElias/5sdfzev5/

我希望这对你有所帮助。

使用选择删除部分过滤器

2 个答案: