使用动态控制器

时间:2015-05-29 19:42:42

标签: angularjs angularjs-directive angular-ui-router

我有一个动态控制器的指令,它通过controller-name属性传递。

指令:

angular
        .module('directives.panel', [])
        .directive('panel', panel);

panel.$inject = ['$timeout', '$parse'];

        function panel($timeout, $parse) {

            var directive = {
                restrict: 'EA',
                transclude: true,
                replace: true,
                template: '<div class="panel panel-solid panel-table" ng-transclude></div>',
                controller: '@',
                name: 'controllerName',
                controllerAs: 'panel',
                link: linkFunc
            };

            return directive;

            }
        }

是否可以将解析'taskbook'对象注入动态控制器? 当我尝试这样做时,我会得到未知的提供者。但是,注入资源服务(GroupResource)可以正常工作。

是否可以在指令控制器中注入resolve?

国家

angular
        .module('taskbooks.taskbook', [
            'deployment.group',
            'resource.deployment',
            'resource.taskbook'
        ])
        .config(TaskbookConfig)
        .controller('TaskbookController', TaskbookController);

    TaskbookConfig.$inject = ['$stateProvider', '$provide'];

    function TaskbookConfig($stateProvider) {

        $stateProvider
            .state('taskbooks.taskbook', {
                url: 'taskbooks/:taskbookId',
                parent: 'taskbooks',
                views: {
                    "mainContent@taskbooks": {
                        controller: 'TaskbookController as taskbook',
                        templateUrl: 'taskbook/taskbook.tpl.html'
                    }
                },
                resolve: {
                    taskbook: TaskbookPrepare
                }
            });
    }

    TaskbookPrepare.$inject = ['$stateParams', 'TaskbookResource'];

    function TaskbookPrepare($stateParams, TaskbookResource) {

        return TaskbookResource.get({
            taskbookId: $stateParams.taskbookId
        }).$promise;
    }

指令控制器

angular
       .module('deployment.groups', ['resource.group'])
       .controller('DeploymentGroupController',DeploymentGroupController);

      DeploymentGroupController.$inject = ['$scope', '$element', '$attrs', 'GroupResource', 'taskbook']; 
      function DeploymentGroupController($scope, $element, $attrs, GroupResource, taskbook)  {

       }

1 个答案:

答案 0 :(得分:0)

排序......如果此指令需要与此状态关联的解析,那么可以安全地假设它只会在此状态下使用,是否正确?

继续这个想法,该指令可以引用状态中设置的控制器,并且可以将解析添加到控制器范围。

这是我所说的非常简化的版本......

angular
    .module('taskbooks.taskbook')
    .config([ $stateProvider, function ($stateProvider) {

        $stateProvider
            .state('taskbook', {
                url: '/:id',
                parent: 'taskbooks',
                resolve: {
                    taskbook: [ '$stateParams', 'TaskbookResource', function ($stateParams, TaskbookResource) {
                        return TaskbookResource.get({
                            taskbookId: $stateParams.taskbookId
                        }).$promise;
                    }]
                },
                controller: ['taskbook', function (taskbook) {
                    this.taskbook = taskbook;
                }],
                controllerAs: 'taskController'
            });

    }])
    .directive('someDirective', function() {
        return {
            restrict: 'EAC',
            controller: 'taskController',
            link: function (scope, el, attr, ctrl) {
                var taskbook = ctrl.taskbook;
            }
        }
    });

请注意,我删除了很多与您无关的代码,只是为了更快地解决问题。显然,这可以重新编写到您编写的结构中。