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

Question

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

• Bộ điều khiển có đơn hoặc được tạo/hủy theo yêu cầu không?
• Nếu sau này, điều gì kích hoạt việc tạo/hủy bộ điều khiển?

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 tìm đến /users/1, sử dụng 1 được nạp, và thiết lập để $scope.

Sau đó, khi tôi điều hướng đến /users/2, người dùng 2 được tải. Có cùng một phiên bản của UserEditorCtrl được sử dụng lại hoặc là một phiên bản mới được tạo không?

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

Answer 1

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

Bộ điều khiển không phải là đĩa đơn. 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ờ bị tự động hủy. Thực tế là nó thường liên kết 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ô ích (ít nhất, theo thiết kế, nó nên được).

Trả lời câu hỏi cụ thể của bạn, một chỉ thị ngView (cũng cho ngController chỉ thị) sẽ luôn create a new controller and a new scope mỗi khi một chuyển hướng xảy ra. Và last scope is going to be destroyed là tốt.

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

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

Đối ngView cụ 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 
}); 

Here is a Plunker bằng chứng minh khái niệm (mở cửa sổ bảng điều khiển).