AngularJS 是一款流行的前端框架，它采用 MVC（模型-视图-控制器）的设计模式。在 AngularJS 中，控制器是负责处理相应视图的逻辑部分，控制器实例化后会被绑定到视图上，然后对数据进行操作和处理。在这篇文章中，我们将详细介绍 AngularJS 控制器的生命周期以及其执行顺序。
生命周期阶段
AngularJS 控制器的生命周期包括以下阶段：
- 创建阶段
- 初始化阶段
- 运行阶段
- 销毁阶段
1. 创建阶段
当 AngularJS 加载一个页面时，它会扫描 HTML 内容并找到所有指定的控制器。然后，AngularJS 会创建控制器实例，该实例通常是使用 ng-controller 指令指定的。在控制器实例化过程中，AngularJS 会检查是否存在依赖注入，并自动注入所需的服务和依赖项。
下面是一个简单的示例，展示了如何创建一个基本的 AngularJS 控制器：
-- -------------------- ---- -------
--------- -----
----- --------- ---------------
------
----- ----------------
--------- ------- -----------
------- ------------------------------------------------------------------------------------
-------
------
---- -----------------------------
---------- --------------
------
--------
--- --- - ----------------------- ----
------------------------------ ---------------- -
----------- - --------
---
---------
-------
-------在上述示例中，我们定义了一个名为 myController 的控制器，并将其绑定到 HTML 页面中的 <div> 元素上。然后，我们使用依赖注入来传递 $scope 服务，这是 AngularJS 中的一个核心服务之一。在控制器实例化时，AngularJS 将自动注入 $scope 服务。
2. 初始化阶段
一旦 AngularJS 创建了控制器实例，它就会开始执行初始化阶段。在此阶段中，AngularJS 会调用控制器的构造函数并为其注入所需的任何依赖项。一旦构造函数完成，AngularJS 就会创建控制器的 $scope 对象。
在 $scope 对象创建完成后，AngularJS 会执行控制器的 $scope.$onInit() 方法（如果存在的话）。这个方法可以用来初始化控制器的状态。
下面是一个简单的示例，展示了如何使用 $onInit() 方法：
app.controller("myController", function($scope) {
$scope.name = "World";
$scope.$onInit = function() {
console.log("Controller initialized!");
};
});在上述示例中，我们定义了一个名为 $onInit() 的方法，在控制器初始化完成后会自动调用。在该方法中，我们输出一条日志以表明控制器已经成功初始化。
3. 运行阶段
一旦 AngularJS 完成了控制器的初始化，它就会进入运行阶段。在此阶段中，AngularJS 会根据需要对控制器进行更新。
更新控制器通常是由应用程序状态的更改触发的。例如，如果用户在文本框中输入了新的数据，则 AngularJS 将检测到这个更改并立即更新控制器的状态。在这种情况下，AngularJS 会自动将新的数据绑定到视图上，以便用户可以看到他们输入的内容。
下面是一个简
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/25046