既存の Microsoft MVC 3 アプリケーションにいくつかの機能を追加しています。ページに新しい機能を追加する必要がある一方で、アプリ自体の既存の構造を変更することはできません。div で実行中の角度があります (jquery ダイアログを介してロード時に非表示になります)。MVC アプリには、ページにいくつかのタブがあります。タブが選択されるたびに、部分的な cshtml (剃刀) が読み込まれます。そのパーシャルと共に、Angular テンプレートが含まれています。パーシャルは、Angular コントローラーを含む js ファイルを参照します。最初にロードされ、ユーザーがタブを開いてangularを含むjqueryダイアログを開くと、すべて正常に機能します。変更を保存した後、おかしな動作に気付き始めました。angularテンプレートを含むダイアログを閉じ、別のタブに切り替えた場合、同じ不規則な動作に気付きました。次に、Angular テンプレートを含むタブに戻ります。何が起こっているかは次のとおりです。
- MVC によって読み込まれるパーシャルは、参照されている js ファイルで angularjs コントローラー メソッドを開始する angular テンプレートをリロードします。
- これが発生するたびに、新しい $scope が生成されます。
- コントローラ メソッドが (テンプレートのボタンに関連付けられた ng-click イベントを介して) 呼び出されるたびに、メソッドは n 回実行されます。n は、ページ全体が最後に更新されてからパーシャルが読み込まれた回数です。
コントローラーメソッドの開始時に $scope オブジェクトをウィンドウに記録することで、このメソッドを証明しました
window['scope_' + new Date().getTime().toString()] = $scope;
ページの部分的な読み込みが完了するたびに、新しい $scope オブジェクトがウィンドウに記録されます。テンプレートのボタンを押すと、ng-click イベントに関連付けられた特定のメソッドが呼び出されました。このイベントは複数回発生します。ただし、ウィンドウに記録されている最も古いスコープ オブジェクトを使用して、コンソールでメソッドを手動で呼び出す
scope_1378413848781.$apply(scope_1378413848781.getSomeData())
意図したとおりに機能します。 私の質問は、MVC フレームワークがパーシャルをリロードするたびにコントローラーが新しいスコープを追加しないようにするにはどうすればよいですか?
以下は、私が試した中でうまくいかなかったもののいくつかです。
- グローバル フラグを追加し、設定されている場合はコントローラー メソッドを終了する
- コントローラーの参照を _layout.cshtml ファイルに移動する
- テンプレートを含むダイアログが閉じられたときにスコープを破棄する
最後に 1 つ、Angular ルート プロバイダーを使用していません。