Question

我有一个问题，我将继续解释。在html页面顶部使用ControllerAS时，如下所示：

<div ng-controller="MyController as myControllerVM">

我可以使用myControllerVM名称来引用控制器中的内容。

即在我的控制器中，我设置了一个变量，并将其他变量分配给它：

var vm = this; 
vm.number = 1;

然后我可以在html中引用这个变量，如下所示：

myControllerVM.number

只要在我的页面顶部我有

 <div ng-controller="MyController as myControllerVM">

我想要做的只是通过路由完成同样的事情。我试过这个：

.when(myROUTE, {
            templateUrl: 'template.html',
            controller: 'MyController',
            controllerAs: 'myControllerVM'

并将控制器中的所有内容分配给变量vm，该变量与以前一样指向this。但是在我的html页面中，这些值并没有像html页面顶部的“控制器为”名称那样被触及，即我不能再将html中的值称为myControllerVM.name（价值没有通过）。我在路线中需要它的原因是因为我想为一个html页面使用不同的控制器。

为什么在路线工作中没有使用controllerAs。

Answer 1

我无法看到您的所有代码，但您可以在这里找到工作示例

http://plnkr.co/edit/aedTeP2DbicGYwdGWKvU?p=preview

即：

myApp.config(function($stateProvider, $urlRouterProvider) {
  //
  // For any unmatched url, redirect to /state1
  $urlRouterProvider.otherwise("/state1");
  //
  // Now set up the states
  $stateProvider
    .state('state1', {
      url: "/state1",
      templateUrl: "state1.html",
      controller: 'state1Ctrl',
      controllerAs:'vm'
    })

    .state('state2', {
      url: "/state2/",
      templateUrl: "state2.html",
      controller: 'state2Ctrl',
      controllerAs:'vm'



    });
});

myApp.controller('state2Ctrl', function(){
  var vm = this;
  vm.title= "That is my second"

});

myApp.controller('state1Ctrl', function($scope){
  var vm = this;
  vm.title= "fist controller";


});

Answer 2

你正在用

做正确的事

.when(myROUTE, {
            templateUrl: 'template.html',
            controller: 'MyController',
            controllerAs: 'myControllerVM'

我不确定Angular文档是否足够明确，但路由器当前控制器的范围是ngView的范围。因此，您只能在模板或MyController元素属性中使用myControllerVM范围变量（包括使用ngView标识符的变量）。我想这是问题的根源。

Angular - 在路由中使用ControllerAs的多个控制器

2 个答案: