☰

AngularJS コントローラーのライフサイクルとは何ですか? 質問する

tag-icon • tag-icon javascript angularjs
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 が読み込まれ、 に設定されます$scope。

次に、 に移動すると/users/2、ユーザー 2 が読み込まれます。 の同じインスタンスがUserEditorCtrl再利用されるのでしょうか、それとも新しいインスタンスが作成されますか?

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

ベストアンサー1

さて、実際のところ、コントローラーのライフサイクルとは何かという疑問がありますngView。

コントローラーはシングルトンではありません。誰でも新しいコントローラーを作成でき、自動的に破棄されることはありません。実際、コントローラーは一般に、基礎となるスコープのライフサイクルにバインドされています。コントローラーは、そのスコープが破棄されても自動的に破棄されるわけではありません。ただし、基礎となるスコープを破棄すると、そのコントローラーは役に立たなくなります (少なくとも、設計上はそうあるべきです)。

あなたの具体的な質問に答えると、ngView指令（指令用も同様ngController）は常に新しいコントローラーと新しいスコープを作成するナビゲーションが発生するたびに、最後のスコープは破壊されるだろう同じように。

ライフサイクルの「イベント」は非常にシンプルです。「創造イベント」コントローラー自体の構築です。コードを実行するだけです。いつ役に立たなくなるかを知るには（「破壊イベント」）、スコープ$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
});

プランカーです概念証明付き (コンソール ウィンドウを開きます)。

おすすめ記事