Угловой ui-router: дочернее состояние, не доступное к родительскому контроллеру

Question

Я использую вложенные представления ui.router в моем приложении Angular. Это соответствующая часть моей .config:

$urlRouterProvider.otherwise('/'); 

$stateProvider 
.state('home', { 
    url: '/', 
    templateUrl: 'app/components/home/home.html', 
    controller: 'HomeController' 
}) 
.state('admin', { 
    url: '/admin', 
    templateUrl: 'app/components/admin/admin-dashboard.html', 
    controller: 'AdminCtrl' 
}) 
.state('admin.page-1', { 
    templateUrl: 'app/components/admin/page-1/page-1.view.html', 
    controller: 'AdminCtrl' 
}) 

То, что происходит, хотя admin.page-1 вид загружается правильно внутри admin взгляд, кажется, не имеют доступа к AdminCtrl.

Это контроллер:

(function() { 
    'use strict'; 

    angular 
     .module('peaches') 
     .controller('AdminCtrl', Controller); 

    Controller.$inject = ['$scope']; 

    function Controller($scope) { 
     var vm = this; 

     vm.test = "Hello." 
     console.log(vm.test); 

     vm.organization = { 
      name: "Western Fund" 
     }; 

     activate(); 

     function activate() { 

     } 
    } 
})(); 

console.log(vm.test) ДЕЛАЕТ работу, когда я иду в admin.page-1, но это не похоже, чтобы загрузить в моей вложенной зрения, page-1.view.html здесь:

<div class="col-xs-12"> 
    <h1>{{vm.test}}</h1> 
</div> 

Что я делаю неправильно?

Answer 1

Как апедемак и dhavalcengg сказал, я не определил controllerAs в моих маршрутах, так vm не был определен. Это устранило проблему:

.state('admin', { 
    url: '/admin', 
    templateUrl: 'app/components/admin/admin.html', 
    controller: 'AdminCtrl as vm' 
}) 

Answer 2

Я думаю, что вы говорите о совместном использовании $ scope между родителем и дочерним с помощью ui-router. вот пост, который объясняет это с примером https://stackoverflow.com/a/27699798/284225