AngularJs-ng-repeat完成后进行操作

(function () {
    var as = angular.module('ppjrApp');

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

    as.controller('couponSourceCtrl', function ($scope, $http, $location, ppObj, ppTools) {
        $scope.$on('ngRepeatFinished', function (ngRepeatFinishedEvent) {
            for (var i = 0; i < $scope.list.length; i++) {
                var item = $scope.list[i];

                $('#datepicker_start_' + item.id).datetimepicker({
                    show: true,
                    format: 'yyyy-mm-dd hh:ii:ss',
                    language: 'zh-CN',
                    weekStart: 1,
                    autoclose: true,
                    orientation: 'right',
                    todayBtn: 'linked',
                    clearBtn: 'linked'
                });
                $('#datepicker_end_' + item.id).datetimepicker({
                    show: true,
                    format: 'yyyy-mm-dd hh:ii:ss',
                    language: 'zh-CN',
                    weekStart: 1,
                    autoclose: true,
                    orientation: 'right',
                    todayBtn: 'linked',
                    clearBtn: 'linked'
                });
            }
        });
    });
}());

当时做的是一个需要动态生成多行(不确定行数)的列表,每个列表需要两个时间空间,不知道时间控件的初始化函数放在哪,

结果找到了这个加载完成的监听事件,可以在Angular渲染完成后进行时间控件的初始化操作。

注意:

这是HTML中设置自定义ID:

<input type="text" id="coupon_name_{{item.id}}" value="{{item.couponName}}">

这是JS中获取

$('#datepicker_end_' + item.id).datetimepicker
# 前端 

评论

Your browser is out-of-date!

Update your browser to view this website correctly. Update my browser now

×