javascript - AngularJS控制器的生命周期是什么？(What is the lifecycle of an AngularJS Controller?)

Question

Can someone please clarify what the lifecycle of an AngularJS controller is?(有人可以澄清一下AngularJS控制器的生命周期是什么吗？)

Is a controller a singleton, or created / destroyed on demand?(控制器是单例，还是按需创建/销毁？) If the latter, what triggers the creation / destruction of the controller?(如果是后者，是什么触发了控制器的创建/销毁？) Consider the below example:(考虑以下示例：) 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}); }); eg:(例如：) In the above example, when I navigate to /users/1 ,user 1 is loaded, and set to the $scope .(在上面的示例中，当我导航到/users/1 ，加载了用户1，并设置为$scope 。) Then, when I navigate to /users/2 , user 2 is loaded.(然后，当我导航到/users/2 ，加载用户2。) Is the same instance of UserEditorCtrl reused, or is a new instance created?(是否重用UserEditorCtrl的相同实例，或者是否创建了新实例？) If it's a new instance, what triggers the destruction of the first instance?(如果它是一个新实例，是什么触发了第一个实例的破坏？) If it's reused, how does this work?(如果它被重用，这是如何工作的？) (ie., the method to load the data appears to run on creation of the controller)(（即，加载数据的方法似乎在创建控制器时运行）)   ask by Marty Pitt translate from so

Answer 1

Well, actually the question is what is the life cycle for a ngView controller.(那么，实际上问题是ngView控制器的生命周期是什么。)

Controllers are not singletons.(控制器不是单身人士。) Anyone can create a new controller and they are never auto-destroyed.(任何人都可以创建一个新的控制器，它们永远不会被自动销毁。) The fact is that it's generally bound to the life cycle of its underlying scope.(事实是，它通常与其基础范围的生命周期有关。) The controller is not automatically destroyed whenever its scope is destroyed.(只要其范围被销毁，控制器就不会自动销毁。) However, after destroying an underlying scope, its controller is useless (at least, by design, it should be).(但是，在破坏基础范围之后，它的控制器是无用的（至少，设计应该如此）。) Answering your specific question, a ngView directive (as well for ngController directive) will always create a new controller and a new scope every time a navigation happens.(回答您的具体问题，每次导航发生时， ngView指令（以及ngController指令）将始终创建一个新控制器和一个新范围 。) And the last scope is going to be destroyed as well.(最后一个范围也将被销毁 。) The life cycle "events" are quite simple.(生命周期“事件”非常简单。) Your "creation event" is the construction of your controller itself.(您的“创建事件”是控制器本身的构造。) Just run your code.(只需运行您的代码。) To know when it gets useless ( "destruction event" ), listen to scope $destroy event:(要知道它什么时候变得无用（ “破坏事件” ），请听范围$destroy事件：) $scope.$on('$destroy', function iVeBeenDismissed() { // say goodbye to your controller here // release resources, cancel request... }) For ngView specifically, you are able to know when the content gets loaded through the scope event $viewContentLoaded :(对于ngView ，您可以通过范围事件$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 with a concept proof (open your console window).(这是一个带有概念证明的Plunker （打开你的控制台窗口）。)