Угловые - Несколько контроллеров, использующих контроллеры на маршруте

Question

У меня проблема, которую я объясню. При использовании ControllerAS в верхней части страницы HTML, такие как это:

<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 (значение isn ' t). Причина, по которой я нуждаюсь в этом маршруте, заключается в том, что я хочу использовать разные контроллеры для одной 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' 

Я не уверен, что документация на углы достаточно ясна, но Объем текущего контроллера маршрутизатора составляет ngView. Таким образом, вы можете использовать переменные области MyController (включая те, которые используют идентификатор myControllerVM) только в шаблонах или атрибутах элементов ngView. Я думаю, это источник проблемы.