一、AngularJS 简介

在前端框架的发展历程中，AngularJS 是一个不可忽视的名字。它由 Google 开发，采用 MVVM 架构，是一个 Ja vaScript 框架，具备数据双向绑定、依赖注入、模块化和路由管理等核心功能，尤其适合构建单页面应用（SPA）。需要提前说明，这里所指的 AngularJS 是 1.x 版本，与后续的 Angular 2+ 完全不同，二者切勿混淆。

二、AngularJS 安装方式

2.1 使用 CDN（推荐）

最简单的做法是在 HTML 中直接引用 CDN 地址：

若担心访问速度，可使用国内镜像：

2.2 本地引入方式

1. 前往官网 https://angularjs.org/ 下载 angular.min.js 文件
2. 将文件放入项目目录
3. 在 HTML 中引用：

三、AngularJS 快速上手示例

  
  
  



  
{{ greeting }}
  
  
你好，{{ name }}！




四、核心概念说明
概念
说明
ng-app
定义 AngularJS 应用的根作用域
ng-model
实现数据双向绑定
ng-controller
控制器，用于管理作用域数据
ng-repeat
列表循环渲染
ng-if / ng-show
条件渲染控制
五、常见指令与用法

{{ message }}

显示这段文字


  
{{ item }}



  
  提交

六、模块与控制器
var app = angular.module('myApp', []);
app.controller('MainCtrl', function($scope) {
  $scope.message = "你好，AngularJS！";
});
七、常见问题
Q1: {{}}不渲染？
检查是否声明了 ng-app 以及控制器是否正确绑定
Q2: 控制台报错 "angular is not defined"？
检查 angular.js 文件是否已正确引入
确保引用顺序正确（AngularJS 应优先于自定义脚本加载）
八、AngularJS 生命周期说明
配置阶段：完成路由、依赖等配置
运行阶段：应用初始化
模型改变 → DOM 自动更新（数据绑定机制）
九、学习资源推荐
AngularJS 官网
W3School AngularJS 教程
菜鸟教程 AngularJS