Assign multiple controller in $stateProvider.state

会有一股神秘感。 提交于 2020-01-12 04:33:05

问题


Probably this is an easy question for advanced angular users, but I did not find this issue somewhere well explained.

So I was restructuring my code, when I realized, I have two controllers in a view, which is not a problem, when controller 'ACtrl' is binded by the $stateProvider and controller 'BCtrl' is binded in the view by ng-controller. But when I try to assign both of them in the $stateProvider like this:

$stateProvider.state('a.view', {
    url: "/anurl",
    views: {
        'menuContent': {
            templateUrl: "anUrlToMyTemplates",
            controller: 'ACtrl', 'BCtrl'
        }
    }
}); 

or that:

$stateProvider.state('a.view', {
    url: "/anurl",
    views: {
        'menuContent': {
            templateUrl: "anUrlToMyTemplates",
            controller: 'ACtrl',
            controller: 'BCtrl'
        }
    }
});

it won't work.

I know it would be a solution to make the content of the controllers up to one, but controller 'ACtrl' is used somewhere else, too, so I would have to repeat myself somewhere else. How can I solve this...


回答1:


Syntaxically, it can't work. This (syntaxically) could work :

$stateProvider.state('a.view', {
    url: "/anurl",
    views: {
        'menuContent': {
            templateUrl: "anUrlToMyTemplates",
            controller: ['ACtrl', 'BCtrl']
        }
    }
}); 

But AngularJS use ZERO or ONE controller by DOMElement.

You can assign CtrlA for your A view :

$stateProvider.state('a.view', {
    url: "/anurl",
    views: {
        'menuContent': {
            templateUrl: "anUrlToMyTemplates",
            controller: 'ACtrl'
        }
    }
}); 

And then into your A view :

<div data-ng-controller="BCtrl">
    <!-- your view content -->
</div>

That said, for code design purpose, the correct way is to merge the actions of your two controllers in only one if they have to control the same template elements. If they control different parts of the template, use one controller for one part, or a controller for the whole view, and an other for the specific part :

<!-- your view controlled by ACtrl configured in route provider -->
<div> 
    <!-- your view content, part A -->

    <div data-ng-controller="BCtrl">
        <!-- your view content, part B -->
    </div>
</div>



回答2:


Split your layout and use something like:

.state('app.somestate', {
            url : '/someurl',
            views:{
                'menuContent': {
                    templateUrl: 'part1.html',
                    controller: 'ACtrl'
                },
                'otherContent': {
                    templateUrl: 'part2.html',
                    controller: 'BCtrl'
                },
                'someotherContent': {
                    templateUrl: 'part3.html',
                    controller: 'CCtrl'
                }
            }
        })


来源:https://stackoverflow.com/questions/30501931/assign-multiple-controller-in-stateprovider-state

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!