1

我试图在我的控制器中查看由视图中的过滤器生成的集合时遇到问题。

我将过滤后的数据存储在一个变量中:

 <table class="table">
     <tr ng-repeat="item in filteredCollection = (myCollection | filter: txtSearch)">
         <td ng-bind="item"></td>
     </tr>
 </table>

我想在我的控制器中订阅“filteredCollection”的更改:

$scope.$watchCollection('filteredCollection', function() {
    if (typeof($scope.filteredCollection) != 'undefined')
        console.log('Results changed : ' + $scope.filteredCollection.length);
});

我已经设置了这个 JSFiddle来向你展示我的问题:我的 watch 函数永远不会被调用。

有趣的事实是,当我删除<tabset> <tab>HTML 中的所有标签时,它会起作用。我想我搞砸了 $scope,但我不明白为什么。也许标签集创建了一个新的 $scope 孩子或其他东西。

我希望你们能了解这里发生了什么,

干杯

4

3 回答 3

1

尝试放入filteredCollection一个对象,因此它将更改正确的范围属性:

$scope.obj = { filteredCollection : [] };
$scope.$watchCollection('obj.filteredCollection', function(newVal) {
    if (typeof($scope.obj.filteredCollection) != 'undefined')
        console.log('Results changed : ' + $scope.obj.filteredCollection.length);
});

在 HTML 中:

<tr ng-repeat="item in obj.filteredCollection = (myCollection | filter: txtSearch)">

看到这个小提琴

于 2015-04-01T14:23:48.310 回答
1

您的想法是正确的,tabsettab创建了新的范围。因此,您正在失去上下文,filteredCollection因为它现在是在tab指令范围的上下文中创建的。

Angular 最近添加controllerAs了有助于避免此类情况的语法。它使我们能够更好地确定正在执行某事的范围。

我已经用controllerAs语法更新了你的 jsFiddle,以展示这有什么帮助。手表现在按预期触发。

http://jsfiddle.net/hezwyjx1/2/

以下是有关控制器语法帮助的资源:

http://toddmotto.com/digging-into-angulars-controller-as-syntax/

于 2015-04-01T14:25:02.053 回答
0

这是另一个解决方案的帖子: https ://github.com/angular-ui/bootstrap/issues/1553

于 2015-08-06T10:03:58.160 回答