Angular自定义指令之渲染完数据后执行js

不多说,直接上代码

App.directive('onFinished', function ($timeout) {
    return {
        restrict: 'A',
        link: function (scope, element, attr) {
            if (scope.$last === true) {
                $timeout(function () {
                    scope.$emit('ngRepeatFinished');
                });
            }
        }
    }
});

注解:link中当scope中的 last()ngRepeatFinishedscope. l a s t ( 也 就 是 最 后 一 条 数 据 ) , 加 载 完 毕 后 触 发 ′ n g R e p e a t F i n i s h e d ′ 。 s c o p e . emit(‘ngRepeatFinished’);这句话就相当于trigger,会触发定义的事件监听:
也就是我们在controller中会添加如下代码:

$scope.$on('ngRepeatFinished', function( ngRepeatFinishedEvent ) {
    //要执行的代码
})

最后,要在HTMl代码中需要加载数据的位置增加指令属性,如下代码:

repeat="item in itemList" on-finished>

你可能感兴趣的:(Angular篇)