[解決済み】AngularJSコントローラのライフサイクルは何ですか？

質問

AngularJSのコントローラのライフサイクルはどのようなものか、どなたか明確に教えてください。

• コントローラはシングルトンですか、それともオンデマンドで作成/破棄されますか？
• 後者の場合、コントローラの生成/破棄のトリガーは何ですか？

以下の例で考えてみましょう。

var demoApp = angular.module('demo')
  .config(function($routeProvider, $locationProvider) {
    $routeProvider
      .when('/home', {templateUrl: '/home.html', controller: 'HomeCtrl'})
      .when('/users',{templateUrl: '/users.html', controller: 'UsersCtrl'})
      .when('/users/:userId', {templateUrl: '/userEditor.html', controller: 'UserEditorCtrl'});
  });

demoApp.controller('UserEditorCtrl', function($scope, $routeParams, UserResource) {
  $scope.user = UserResource.get({id: $routeParams.userId});
});

などです。

上記の例で、私が /users/1 ユーザー1が読み込まれ、そのユーザー1に設定されます。 $scope .

に移動すると /users/2 の場合、ユーザー2がロードされます。 のインスタンスは同じですか？ UserEditorCtrl は再利用されるのか、それとも新しいインスタンスが作成されるのか？

• 新しいインスタンスである場合、最初のインスタンスを破壊するトリガーは何ですか？
• 再利用される場合、これはどのように機能するのでしょうか？ (つまり、データをロードするメソッドは、コントローラの作成時に実行されるようです)

どのように解決するのですか？

さて、実際のところ、この問題は ngView コントローラを使用します。

コントローラはシングルトンではありません。誰でも新しいコントローラを作成することができ、それらは決して自動破棄されません。実は、一般的にはその下にあるスコープのライフサイクルに束縛されているのです。そのスコープが破壊されても、コントローラは自動的には破壊されません。しかし、基礎となるスコープを破壊した後、そのコントローラは役に立ちません（少なくとも、設計上はそうであるべきです）。

具体的な質問にお答えしますと ngView ディレクティブは ngController ディレクティブ) は常に は新しいコントローラと新しいスコープを作成します。 は、ナビゲーションが発生するたびに そして 最後のスコープが破壊される も同様です。

ライフサイクル"event"は非常にシンプルです。あなたの "作成イベント" は、コントローラの構築そのものです。コードを実行するだけです。いつ無駄になったかを知るために ( 破壊イベント。 を聞く。 $destroy イベントを発生させます。

$scope.$on('$destroy', function iVeBeenDismissed() {
  // say goodbye to your controller here
  // release resources, cancel request...
})

について ngView 具体的には、コンテンツがいつ読み込まれたかを、スコープイベント $viewContentLoaded :

$scope.$on('$viewContentLoaded', function readyToTrick() {
  // say hello to your new content here
  // BUT NEVER TOUCHES THE DOM FROM A CONTROLLER
});

プランカーはこちら をコンセプトプルーフで表示します（コンソールウィンドウを開いてください）。