Vòng đời của Bộ điều khiển AngularJS là gì?

Ai đó có thể vui lòng làm rõ vòng đời của bộ điều khiển AngularJS là gì không?

• Là một bộ điều khiển là một singleton, hoặc được tạo / hủy theo yêu cầu?
• Nếu sau này, cái gì kích hoạt việc tạo / hủy bộ điều khiển?

Hãy xem xét ví dụ dưới đây:

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

ví dụ:

Trong ví dụ trên, khi tôi điều hướng đến /users/1, người dùng 1 được tải và được đặt thành $scope.

Sau đó, khi tôi điều hướng đến /users/2, người dùng 2 được tải. Là cùng một thể hiện của UserEditorCtrltái sử dụng, hoặc là một thể hiện mới được tạo ra?

• Nếu đó là một phiên bản mới, điều gì gây ra sự phá hủy của phiên bản đầu tiên?
• Nếu nó được tái sử dụng, làm thế nào nó hoạt động? (tức là, phương thức tải dữ liệu dường như chạy khi tạo bộ điều khiển)

Vâng, thực sự câu hỏi là vòng đời cho ngViewbộ điều khiển là gì.

Bộ điều khiển không phải là singletons. Bất cứ ai cũng có thể tạo một bộ điều khiển mới và chúng không bao giờ tự động bị phá hủy. Thực tế là nó thường bị ràng buộc với vòng đời của phạm vi cơ bản của nó. Bộ điều khiển không tự động bị phá hủy bất cứ khi nào phạm vi của nó bị phá hủy. Tuy nhiên, sau khi phá hủy một phạm vi cơ bản, bộ điều khiển của nó là vô dụng (ít nhất, theo thiết kế, nó phải như vậy).

Trả lời câu hỏi cụ thể của bạn, một lệnh ngView(cũng như ngControllerchỉ thị) sẽ luôn tạo ra một bộ điều khiển mới và một phạm vi mới mỗi khi điều hướng xảy ra. Và phạm vi cuối cùng cũng sẽ bị phá hủy .

Vòng đời "sự kiện" khá đơn giản. "Sự kiện sáng tạo" của bạn là việc xây dựng bộ điều khiển của chính bạn. Chỉ cần chạy mã của bạn. Để biết khi nào nó trở nên vô dụng ( "sự kiện hủy diệt" ), hãy lắng nghe $destroysự kiện phạm vi :

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

Đối với ngViewcụ thể, bạn có thể biết khi nội dung được nạp thông qua các sự kiện quy mô $viewContentLoaded:

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

Đây là một Plunker với một bằng chứng khái niệm (mở cửa sổ giao diện điều khiển của bạn).