web-dev-qa-db-ja.com

AngularJSの別のコントローラー内でコントローラーを使用する

2番目のコントローラー内のコントローラーの変数にバインドできないのはなぜですか？

<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"];
}]);

例： https://jsfiddle.net/nukRe/135/

2番目のng-repeatは機能しません。

angularjsbindingcontrollerangularjs-controllerangularjs-controlleras
8
Evl-ntnt

controllerAsを使用しているので、コントローラーでthisキーワードを使用する必要があります

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

フォークフィドル

[〜＃〜]注[〜＃〜]

技術的には、一度に1つのアプローチに従う必要があります。この2つのパターンを混同しないでください。$scopeを使用してcontrollerAsに対して行ったように、MainCtrl構文/通常のコントローラー宣言を使用してください。

6
Pankaj Parkar

削除する

中のように

ここから：

<div ng-controller="InsideCtrl as inside"> そのような：

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