web-dev-qa-db-ja.com

$ stateProvider.stateに複数のコントローラーを割り当てます

たぶん、これは上級のangularユーザーにとっては簡単な質問ですが、この問題はどこかよく説明されていませんでした。

だから私はコードを再構築していました、私が気づいたとき、私はビューに2つのコントローラーがあります、それは問題ではありません、コントローラー 'ACtrl'が$ stateProviderによってバインドされ、コントローラー 'BCtrl'がng-controllerによってビューにバインドされているとき。しかし、次のように$ stateProviderで両方を割り当てようとすると、

$stateProvider.state('a.view', {
    url: "/anurl",
    views: {
        'menuContent': {
            templateUrl: "anUrlToMyTemplates",
            controller: 'ACtrl', 'BCtrl'
        }
    }
});

またはその：

$stateProvider.state('a.view', {
    url: "/anurl",
    views: {
        'menuContent': {
            templateUrl: "anUrlToMyTemplates",
            controller: 'ACtrl',
            controller: 'BCtrl'
        }
    }
});

動作しません。

コントローラーのコンテンツを1つにすることで解決策になることはわかっていますが、コントローラー 'ACtrl'も別の場所で使用されるため、別の場所で繰り返す必要があります。どうすればこれを解決できますか...

angularjsangularjs-routingangularjs-controllerangular-routing
13
burnaDLX

構文的には機能しません。これは（構文的に）機能します：

$stateProvider.state('a.view', {
    url: "/anurl",
    views: {
        'menuContent': {
            templateUrl: "anUrlToMyTemplates",
            controller: ['ACtrl', 'BCtrl']
        }
    }
});

しかし、AngularJSは[〜＃〜] zero [〜＃〜]または[〜＃〜] one [〜＃〜]コントローラーをDOMElementで使用します。

CtrlAビューにAを割り当てることができます。

$stateProvider.state('a.view', {
    url: "/anurl",
    views: {
        'menuContent': {
            templateUrl: "anUrlToMyTemplates",
            controller: 'ACtrl'
        }
    }
});

そしてinto your A view：

<div data-ng-controller="BCtrl">
    <!-- your view content -->
</div>

つまり、コード設計の目的では、2つのコントローラーが同じテンプレート要素を制御する必要がある場合、2つのコントローラーのアクションを1つにマージすることが正しい方法です。テンプレートのさまざまな部分を制御する場合は、1つの部分に1つのコントローラーを使用するか、ビュー全体に1つのコントローラーを使用し、特定の部分にもう1つのコントローラーを使用します。

<!-- your view controlled by ACtrl configured in route provider -->
<div> 
    <!-- your view content, part A -->

    <div data-ng-controller="BCtrl">
        <!-- your view content, part B -->
    </div>
</div>
17
Rémi Becheras

レイアウトを分割して、次のようなものを使用します。

.state('app.somestate', {
            url : '/someurl',
            views:{
                'menuContent': {
                    templateUrl: 'part1.html',
                    controller: 'ACtrl'
                },
                'otherContent': {
                    templateUrl: 'part2.html',
                    controller: 'BCtrl'
                },
                'someotherContent': {
                    templateUrl: 'part3.html',
                    controller: 'CCtrl'
                }
            }
        })
9
Ioana Cucuruzan