Каков жизненный цикл контроллера 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 event:

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

Вот Plunker с концептуальным доказательством (откройте окно консоли).