AngularJS监听ng-repeat渲染完成后事件

最新推荐文章于 2020-12-07 21:22:33 发布

原创最新推荐文章于 2020-12-07 21:22:33 发布 · 1.2k 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#AngluarJS

js 专栏收录该内容

6 篇文章

订阅专栏

本文介绍了一种在AngularJS中使用自定义指令'on-finish-render-filters'来检测列表渲染是否完成的方法，通过该方法可以执行一些依赖于DOM元素的操作，如调整元素宽度等。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.在html,加上on-finish-render-filters="completeRepeat"

<li ng-repeat="categorie in result.categories" ng-click="clickCategory($index,categorie)" on-finish-render-filters="completeRepeat"> <div class="nav-li-text nav-tab-bor">{{categorie.title}}</div> </li>

2.angularJS 全局

var myapp = angular.module("myapp",[]);
myapp.directive('onFinishRenderFilters', ['$timeout', function ($timeout) {
    return {
        restrict: 'A',
        link: function(scope,element,attr) {
            if (scope.$last === true) {
                var finishFunc=scope.$parent[attr.onFinishRenderFilters];
                if(finishFunc)
                {
                    finishFunc();
                }
            }
        }
    };
}])

3. angularJS 方法

$scope.completeRepeat= function(){
    // 开始骚操作,此改宽度
    if($scope.lang_cout > 5 ){
        $(".nav-li-text").width(Math.round(960/$scope.lang_cout)-12);
    }
}

谢谢.