3

我正在使用 AngularJS 上的指令执行我的第一步，但该指令对我不起作用。

我有一个ng-repeat清单

<ul ng-after-list-filter>
    <li ng-repeat="item in items | filter:activeFilter.filterType = activeFilter.filterValue">...</li>
</ul>

正在被过滤$scope.activeFilter.filterValue

我正在尝试创建ng-after-list-filter指令，以便在过滤列表后执行它，以便我可以对那个新ul元素进行 dom 操作。

这是我的指令不起作用：

myModule.directive('ngAfterListFilter',function(){
    return {
        restrict: 'A',
        link: function(scope,element,attrs) {
            scope.$watch(scope.activeFilter.filterValue, function(val) {
                console.log('do something here');
            });
        }
    }
});

  1. 我如何使它工作？我假设 scope.activeFilter.filterValue 没有被更新，但是 - 它在范围内，并且它确实被更新并且列表被过滤。我正在尝试观察这个变量，为什么它不起作用？

  2. 有没有更好的方法来创建这个指令？我的意思是 - 我想在列表更新时运行 DOM 更改（调整事物的大小）。那么有没有办法听$('ul').html()呢？我试过了，但它输出了一个错误，我将原始文本放入 javascript

4

2 回答 2

7

$last 可用于确定创建最后一个 <li> 的时间。请参阅this fiddle（我没有写它）以了解您可以附加到 <li> 元素的 checkLast 指令的实现：

directive('checkLast', function () {
  return function (scope, element, attrs) {
     if (scope.$last === true) {
        element.ready(function () {
           // manipulate ul here, or if that doesn't work
           // try with $timeout:
           // $timeout(function() { 
           //    do manip here
           //}, 0, false);  // remove false if you need $apply to run

也可以看看https://stackoverflow.com/a/13906907/215945

我不确定 element.ready() 是否必要，或者它是否适用于动态生成的元素。

于 2013-02-01T23:36:04.790 回答
0

您似乎想重用过滤器中的过滤值？正确的？

如果是这种情况，您真正需要做的就是：

<!-- initial filter -->
<ul ng-after-list-filter>
    <li ng-repeat="item in filteredData =  (items | filter:activeFilter.filterType)">{{item}}</li>
</ul>

<!-- reuse what you filtered -->
<div ng-repeat="item in filteredData">{{item}}</div>

我希望我能因此而受到赞扬，但这是我在 StackOverflow 上的另一个问题中看到的一个技巧，我现在找不到。

然后要知道何时更新，您可以filteredData在范围内 $watch ：

myModule.directive('ngAfterListFilter',function(){
    return {
        restrict: 'A',
        link: function(scope,element,attrs) {
            scope.$watch('filteredData', function(val) {
                console.log('do something here');
            });
        }
    }
});
于 2013-01-31T13:57:52.053 回答