AngularJS 教程学习笔记
介绍
AngularJS 是一种用于构建 Web 应用程序的 JavaScript 框架。它是由 Google 维护的开源项目，旨在减轻 Web 开发者的工作负担，并提高 Web 应用程序的可维护性。
AngularJS 的核心是指令系统。指令是一种与 HTML 元素相关联的特殊标记，用于定义应用程序中的行为。使用 AngularJS，开发者可以很容易地将数据模型与视图绑定在一起，并且可以通过指令来处理用户交互。
除了指令系统，AngularJS 还提供了许多其他功能，包括依赖注入、模块化设计和测试框架等。
简单示例
下面是一个简单示例，演示了如何在 AngularJS 中创建一个模块、一个控制器和一个视图，并将它们绑定在一起。
htmlCopy Code<!-- index.html -->
<html ng-app="myApp">
<head>
<title>AngularJS Example</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.2/angular.min.js"></script>
</head>
<body ng-controller="myCtrl">
<h1>{{ welcome }}</h1>
<ul>
<li ng-repeat="player in players">{{ player.name }} ({{ player.position }})</li>
</ul>
<script>
var myApp = angular.module("myApp", []);
myApp.controller("myCtrl", function($scope) {
$scope.welcome = "Welcome to the AngularJS Example";
$scope.players = [
{ name: "LeBron James", position: "Small Forward" },
{ name: "Stephen Curry", position: "Point Guard" },
{ name: "Kevin Durant", position: "Power Forward" }
];
});
</script>
</body>
</html>
上面的代码定义了一个名为 myApp 的模块，并在其中定义了一个名为 myCtrl 的控制器。控制器中定义了一个叫做 welcome 的变量和一个叫做 players 的数组。welcome 变量和 players 数组被用于渲染视图中的表达式和指令。
在 HTML 视图中，ng-app 指令表示这个应用程序使用 myApp 模块。ng-controller 指令将 myCtrl 控制器绑定到页面上的元素中。
{{ welcome }} 是一个表达式，表示将 welcome 变量的值渲染到页面上。ng-repeat 指令根据 players 数组中的对象重复渲染列表项，每个列表项包含球员的姓名和位置信息。
总结
AngularJS 是一种强大且灵活的 JavaScript 框架，提供了许多功能，可帮助 Web 开发者更轻松地构建 Web 应用程序。本文介绍了 AngularJS 的指令系统和其他一些重要功能，并提供了一个简单的示例，演示了如何使用 AngularJS 构建 Web 应用程序。