2

我正在尝试通过路由(使用 angular )延迟加载($ocLazyLoad)一些非角度库(jQuery + css 文件ui.router)。

在这个代码片段中,我试图加载iCheck库,并且只在我的InputsCtrl

这是我的配置:

            .state('dashboard.inputs', {
                url: "/elements/inputs",
                templateUrl: templateProvider.getTemplate('inputs'),
                controller: 'InputsCtrl',
                controllerAs: 'inputs',
                resolve: {
                    loadPlugin: function ($ocLazyLoad) {
                        return $ocLazyLoad.load([
                            {
                                files: [
                                    'bower_components/iCheck/skins/polaris/polaris.css',
                                    'bower_components/iCheck/icheck.min.js'
                                ]
                            }
                        ]);
                    }
                }
            })

它导致以下错误:

在此处输入图像描述

这是我的空控制器:

(function () {
    'use strict';

    angular
        .module('mega-app')
        .controller('InputsCtrl', ctrl);

    function ctrl() {
        var vm = this;

    }

})();

这是我正在使用的指令:

(function () {
    'use strict';

    angular
        .module('mega-app')
        .directive('icheck', icheck);

    function icheck($timeout) {
        return {
            restrict: 'A',
            require: 'ngModel',
            link: function($scope, element, $attrs, ngModel) {
                return $timeout(function() {
                    var value;
                    value = $attrs['value'];

                    $scope.$watch($attrs['ngModel'], function(newValue){
                        $(element).iCheck('update');
                    })

                    return $(element).iCheck({
                        checkboxClass: 'icheckbox_square-green',
                        radioClass: 'iradio_square-green'

                    }).on('ifChanged', function(event) {
                        if ($(element).attr('type') === 'checkbox' && $attrs['ngModel']) {
                            $scope.$apply(function() {
                                return ngModel.$setViewValue(event.target.checked);
                            });
                        }
                        if ($(element).attr('type') === 'radio' && $attrs['ngModel']) {
                            return $scope.$apply(function() {
                                return ngModel.$setViewValue(value);
                            });
                        }
                    });
                });
            }
        };
    }
})();
4

0 回答 0