Angular js:从控制器访问以ng-repeat(ngRepeat)过滤的数据

时间:2014-02-01 14:13:40

标签: angularjs

我需要从控制器访问已经在模板上(在ng-repeat内部)过滤的数据。

这就是我的意思:

我的模板中有这个表:

 <table class="table">
        <thead>
            <th>Name</th>
            <th>Gender</th>
        </thead>
        <tbody>
            <tr ng-repeat="person in persons | filter:query">
                <td>{{person.name}}</td>
                <td>{{person.gender}}</td>
            </tr>
        </tbody>
</table>

然后我有<select>用于按性别过滤数据

<h1>Cluster:</h1>
    <select ng-model="query.gender" >
        <option value ="">ALL</option>
        <option value ="male">Male</option>
        <option value ="female">Female</option>
    </select>

这没问题。

如果有人选择其中一个选项,我需要对过滤后的结果执行某些操作。 这就是为什么我在我的控制器中有一个$ watch,它会查找过滤器查询的更改:

$scope.$watch('query.gender', function(newValue, oldValue) {
            // Here is where I need to get filtered results
});

我的问题是:

如何从控制器访问FILTERED内容?

我最喜欢这个,而不必在控制器中进行另一个“过滤”操作......(因为数据已经过滤,结果是在内存中的某个位置,对吗?)

2 个答案:

答案 0 :(得分:12)

您可以使用以下内容简化代码:

    <tbody>
        <tr ng-repeat="person in (filteredPersons = (persons | filter:query))">
            <td>{{person.name}}</td>
            <td>{{person.gender}}</td>
        </tr>
    </tbody>

之后,您可以访问控制器$scope.filteredPersons或访问视图中的{{filteredPersons}}:)

答案 1 :(得分:5)

我不完全确定,但您可以在控制器中使用过滤功能。所以尝试类似的事情:

$scope.$watch('query.gender', function(newValue, oldValue) {
        var x = $filter('filter')($scope.persons, $scope.query);
});
然后, x应该包含与我认为的表中相同的过滤数据。请查看此处的文档:http://docs.angularjs.org/api/ng.filter:filter了解更多信息。