que - Usando el controlador dentro de otro controlador en AngularJS

ng-controller que es

Question

¿Por qué no puedo vincularme a la variable del controlador dentro del segundo controlador?

<div ng-app="ManagerApp">
    <div ng-controller="MainCtrl">
        Main: 
        <div ng-repeat="state in states">
            {{state}}
        </div>
        <div ng-controller="InsideCtrl as inside">
            Inside:
            <div ng-repeat="state in inside.states2">
                {{state}}
            </div>
        </div>
    </div>
</div>

var angularApp = angular.module(''ManagerApp'', []);

angularApp.controller(''MainCtrl'', [''$scope'', function ($scope) {
    $scope.states = ["NY", "CA", "WA"];
}]);

angularApp.controller(''InsideCtrl'', [''$scope'', function ($scope) {
    $scope.states2 = ["NY", "CA", "WA"];
}]);

Ejemplo: https://jsfiddle.net/nukRe/135/

La segunda repetición ng no funciona.

Answer 1

Como está usando un controllerAs Como debería usar this palabra clave en el controlador

angularApp.controller(''InsideCtrl'', [ function() {
    var vm = this;
    vm.states2 = ["NY", "CA", "WA"];
}]);

Fiddle bifurcado

NOTA

Técnicamente, debes seguir un enfoque a la vez. No mezcle estos dos patrones juntos, use la declaración del controlador / sintaxis / controlador normal como lo hizo para MainCtrl usando $scope

Answer 2

retirar

como adentro

de aquí:

<div ng-controller="InsideCtrl as inside"> tal que:

`<div ng-controller="InsideCtrl">`

Answer 3

<div ng-app="ManagerApp">
    <div ng-controller="MainCtrl">
        Main: 
        <div ng-repeat="state in states">
            {{state}}
        </div>
        <div ng-controller="InsideCtrl">
            Inside:
            <div ng-repeat="state in states2">
                {{state}}
            </div>
        </div>
    </div>
</div>