AngularJS 作为一款经典的前端 JavaScript 框架，其核心在于通过数据绑定和依赖注入简化动态 Web 应用的开发，以下从核心概念、模块化设计、控制器编写、视图交互及最佳实践等方面，系统介绍 AngularJS 的标准写法。

模块与依赖：应用的基础架构

AngularJS 应用以模块为基本单位，通过 angular.module() 方法创建和配置模块，模块不仅作为容器，还负责管理依赖关系，确保组件间的松耦合。

// 创建模块，并注入核心依赖（如 ngRoute 用于路由）var app = angular.module('myApp', ['ngRoute']);

模块设计需遵循单一职责原则，例如将路由、服务、指令等功能拆分为独立模块，再通过主模块整合。

// 定义核心模块var core = angular.module('core', []);// 定义用户模块var user = angular.module('user', ['core']);// 主模块依赖子模块var app = angular.module('myApp', ['core', 'user']);

控制器：数据与逻辑的中枢

控制器负责初始化视图模型（），处理用户交互逻辑，编写控制器时需注意以下几点：

示例：用户列表控制器

app.controller('UserListController', ['$scope', '$http', function($scope, $http) {$scope.users = [];$scope.Loading = true;// 获取用户数据$http.get('/api/users').then(function(response) {$scope.users = response.data;$scope.loading = false;}).catch(function(error) {console.error('获取用户列表失败:', error);$scope.loading = false;});// 删除用户$scope.deleteUser = function(userId) {$http.delete('/api/users/' + userId).then(function() {$scope.users = $scope.users.filter(function(user) {return user.id !== userId;});});};}]);

视图：模板与数据绑定

AngularJS 视图以 HTML 为模板，通过指令实现动态数据绑定，核心指令包括：

示例：用户列表视图

服务：可复用的业务逻辑

服务用于封装可复用的功能（如数据请求、工具函数），通过依赖注入机制在控制器、指令等组件间共享，AngularJS 内置、等服务，也可自定义服务。

示例：自定义用户服务

app.service('UserService', ['$http', function($http) {this.getUsers = function() {return $http.get('/api/users');};this.createUser = function(userData) {return $http.post('/api/users', userData);};}]);// 在控制器中使用app.controller('UserController', ['$scope', 'UserService', function($scope, UserService) {UserService.getUsers().then(function(response) {$scope.users = response.data;});}]);

路由与多页面视图

通过模块实现前端路由，支持多视图切换，配置路由需定义 $routeProvider ，指定路径、模板及控制器。

app.config(['$routeProvider', function($routeProvider) {$routeProvider.when('/users', {templateurl: 'views/users.html',controller: 'UserListController'}).when('/users/:id', {templateUrl: 'views/user-detail.html',controller: 'UserDetailController'}).otherwise({redirectTo: '/users'});}]);

最佳实践与注意事项

通过以上模块化、数据驱动的写法，AngularJS 能够构建结构清晰、易于维护的单页应用，尽管现代前端框架更趋流行，但其核心思想（如依赖注入、数据绑定）仍对前端开发具有深远影响。