在Angular中，嵌套指令重复，如果parent是$last，则传递

Angular, nested directive repeats, pass if parent is $last

本文关键字：last parent Angular 嵌套 指令 如果      更新时间：2023-09-26

我试图触发一个事件一旦所有的重复在这个嵌套的重复完成。我知道你可以使用$last，但我无法在内部repeat中告诉你它是否在父repeat中的$last上。这里是

<div>
    <div ng-repeat="filter in filters.filters" repeat-directive-one filter="filter" update-filter="updateFilter">
</div>
</div>

然后在repeat-directive-one里面看起来像

  <div ng-repeat="item in filter.values | limitTo: filter.showMore ? filter.values.length : '5' track by $index" repeat-directive-two value="::item" update-filter="updateFilter" ng-if="!$last"></div>
<div ng-repeat="item in filter.values | limitTo: filter.showMore ? filter.values.length : '5' track by $index" repeat-directive-two value="::item" update-filter="updateFilter" ng-if="$last"checkbox-fix></div>

那么它的作用是，如果它是在重复的最后一项上，它会添加checkbox-fix指令来修复问题。但是如果上面的repeat有4个条目，则会触发4次所以我想要的是

  ng-if="$last && parent.$last"

，但逻辑似乎没有按预期工作。我甚至试图传递父last(布尔)作为隔离范围attr，如(重复指令1)

   <div ng-repeat="filter in filters.filters" repeat-directive-one filter="filter" update-filter="updateFilter" last-property="$last">

但是正在记录$scope。lastProperty不返回任何值。所以我想要一种传递某种标记的方法父类repeat是$last。有什么办法可以做到吗?谢谢!

你可以尝试像这样广播外循环完成的时间，然后内部循环的最后一个循环应该开始监视$last

<div ng-repeat="stuff in stuffs" outer-loop>
    <div ng-repeat="item in items" inner-loop></div>
</div>

angular.module('test').directive('outerLoop', function($rootScope){
    return function(scope, element, attrs) {
        if (scope.$last){
            $rootScope.$broadcast('outerLoopComplete');
        }   
    };
});
angular.module('test').directive('innerLoop', function(){
    return function(scope, element, attrs) {
        var outerLoopComplete = false;
        scope.$on('outerLoopComplete', function(){
            outerLoopComplete;
        });
        if(outerLoopComplete && $last){
            //inner loop complete
        }
    };
});

我最终根据@trevor的建议解决了这个问题:

<div ng-repeat="item in filter.values | limitTo: filter.showMore ? filter.values.length : '5' track by $index" repeat-directive-two value="::item" update-filter="updateFilter" checkbox-fix></div>

将checkbox-fix固定在repeat上(不需要通过ng-if切换2)，然后在checkbox-fix指令中我这样做:

  return {
        restrict: 'A',
        link: function(elem, attr, tr) {
           if(elem.$parent.$parent.$last && elem.$last){
                //fixed!
           }
        }
    };

所以elem。$last工作得很好，我不得不检查一下数据/结构，意识到我必须执行elem.$parent.$parent。

https://docs.angularjs.org/api/ng/directive/ngInit

你可以使用ngInit将$last的值设置为一个作用域变量，在隔离作用域的情况下，你应该能够从子作用域直接或间接地访问这个变量。

相关文章：