[解決済み] AngularJSによる単一ページアプリの複数コントローラ
質問
1ページのアプリケーションで複数のコントローラを使用する方法を知りたいのです。私はそれを理解しようとし、私は私の非常に似た質問を見つけたが、あなたが単一のページアプリに複数のコントローラを使用しないことを終了する特定の問題を解決するための異なる回答のトンがあるだけです。
それは、1 つのページに複数のコントローラを使用するのは賢明ではないからでしょうか。それとも、単に不可能なのでしょうか?
例えば、すでにメインページで動作する素晴らしい画像カルーセルコントローラーを持っていて、その後(例えば)モーダルの使い方を学び、そのための新しいコントローラーも必要になったとします(あるいは、コントローラーが必要な他のどんなものでも)。そのとき、私はどうすればいいのでしょうか?
私は、他の質問に対して、私とほとんど同じことを尋ねて、人々が "*OMGと答えているいくつかの回答を見たことがあります。なぜそんなことをするのか、これをすればいいじゃないか..."。
一番良い方法、あるいはやり方は何でしょうか?
編集
多くの方は、2つのコントローラを宣言し、ng-controllerで呼び出すと答えています。 私は以下のようなコードで、MainCtrlをng-controllerで呼び出しています。
app.config(function($routeProvider, $locationProvider) {
$routeProvider
.when('/', {
templateUrl: "templates/main.html",
controller:'MainCtrl',
})
.otherwise({
template: 'does not exists'
});
});
コントローラを設定しなくてもng-controllerで済むのに、なぜここでコントローラを設定する必要があるのでしょうか?これが私を混乱させた原因です。(この方法では2つのコントローラを追加することはできないと思います...)
どのように解決するのですか?
何が問題なのでしょうか?複数のコントローラを使用するには、複数のngControllerディレクティブを使用するだけです。
<div class="widget" ng-controller="widgetController">
<p>Stuff here</p>
</div>
<div class="menu" ng-controller="menuController">
<p>Other stuff here</p>
</div>
通常通り、アプリケーションモジュールでコントローラを利用できるようにする必要があります。
最も基本的な方法は、次のようにコントローラの関数を宣言することです。
function widgetController($scope) {
// stuff here
}
function menuController($scope) {
// stuff here
}
関連
-
[解決済み] jQueryでページを更新するにはどうすればよいですか?
-
[解決済み] AngularJS コントローラにおける 'this' と $scope の比較
-
[解決済み] AngularJSでチェックボックスの値のリストにバインドするにはどうすればいいですか?
-
[解決済み] 複数のスペースを1つのスペースに置き換える正規表現
-
[解決済み] AngularJSでコントローラ間の通信を行う正しい方法は何ですか?
-
[解決済み] AngularJS コントローラ間のデータ共有
-
[解決済み】AngularJSはシングルページアプリケーション(SPA)のためだけのものですか?)
-
[解決済み] なぜ "use strict "はパフォーマンスを10倍向上させるのか?
-
[解決済み] javascript の関数から `undefined` と `null` のどちらを返すのが良いのでしょうか?
-
[解決済み] moment.jsでミュータビリティを回避するには?
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] ジェスト あるクラスの特定のメソッドをモックする方法
-
[解決済み] <Enter>でjQuery UIダイアログを送信する
-
[解決済み] JavaScriptで、ある文字列が別の文字列の中に出現するすべてのインデックスを見つけるにはどうすればよいですか?
-
[解決済み] WebStormで未解決の変数が大量にある場合の警告に対処する方法は?
-
[解決済み] javascript includes() 大文字小文字を区別しない
-
[解決済み] Javascriptで動的に命名されたメソッドを呼び出すにはどうすればよいですか?
-
[解決済み] Reactメモを使うべきではない場合とは?
-
[解決済み] AJAX Mailchimp サインアップフォームの統合
-
[解決済み] JavaScriptで長い配列を小さい配列に分割する方法
-
[解決済み] JavaScriptの文字列プリミティブとStringオブジェクトの違いは何ですか?