Quel est le cycle de vie d’un contrôleur de AngularJS ?

Question

Quelqu'un peut-il préciser ce que le cycle de vie d'un AngularJS est un contrôleur?

• Est un contrôleur à un singleton, ou créé ou détruit à la demande?
• Si ce dernier, ce qui déclenche la création / destruction de la manette?

Considérons l'exemple ci-dessous:

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});
});

par exemple:

Dans l'exemple ci-dessus, lorsque je navigue à /users/1,l'utilisateur 1 est chargé, et de définir à l' $scope.

Puis, quand j'ai accédez /users/2, l'utilisateur 2 est chargé. Est la même instance d' UserEditorCtrl réutilisés, ou est une nouvelle instance créée?

• Si c'est une nouvelle instance, ce qui déclenche la destruction de la première instance?
• Si elle est réutilisée, comment cela fonctionne? (c'est à dire., la méthode pour charger les données semble fonctionner sur la création du contrôleur)

Answer 1

Eh bien, effectivement, la question est quel est le cycle de vie d'un ngView contrôleur.

Les contrôleurs ne sont pas des singletons. N'importe qui peut créer un nouveau contrôleur et ils ne sont jamais auto-détruit. Le fait est que c'est généralement lié au cycle de vie sous-jacentes de son champ d'application. Le contrôleur n'est pas détruit automatiquement à chaque fois que son champ d'application est détruit. Cependant, après la destruction d'un sous-jacent de la portée, de son contrôleur est inutile (à moins, de par sa conception, il devrait être).

Pour répondre à votre question précise, ngView directive (aussi bien pour ngController "directive") sera toujours de créer un nouveau contrôleur et un nouveau champ d'application à chaque fois qu'une navigation qui se passe. Et le dernier de la portée va être détruit .

Le cycle de vie "événements" sont assez simples. Votre "création d'un événement" est la construction de votre contrôleur lui-même. Il suffit d'exécuter votre code. Pour savoir quand il devient inutile ("la destruction de l'événement"), écouter de la portée $destroy événement:

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

Pour ngView précisément, vous êtes en mesure de savoir quand le contenu est chargé par l'ampleur de l'événement $viewContentLoaded:

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

Voici une Plunker un concept à la preuve (ouvrez votre fenêtre de la console).