AngularJS是一个JavaScript框架 。 它可以被添加到一个HTML页面以<script>标记。
AngularJS扩展HTML与指令属性和数据绑定到HTML使用表达式 。
AngularJS是一个JavaScript框架
AngularJS是一个JavaScript框架。 它是用JavaScript编写的一个图书馆。
AngularJS分布为JavaScript文件，并且可以被添加到与脚本代码的网页：
<script
src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>AngularJS扩展HTML
AngularJS扩展了NG-指令 HTML。
该NG-应用程序指令定义的AngularJS应用。
在NG-模型指令结合HTML控件的应用程序的数据值（输入，选择，文本区域）。
在NG-绑定指令的应用程序数据绑定到HTML视图。
AngularJS例
<!DOCTYPE html>
<html>
<script
src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body>
<div ng-app="">
<p>Name: <input type="text" ng-model="name"></p>
<p ng-bind="name"></p>
</div>
</body>
</html>
试一试» 例子解释：
当网页加载AngularJS自动启动。
吴应用指令告诉AngularJS的<div>元素是一个AngularJS 应用程序的“所有者”。
在NG-模型指令结合输入字段的应用程序变量名的值。
吴绑定指令绑定<p>元素的应用程序变量名的innerHTML。
AngularJS指令
正如你已经看到的，AngularJS指令是HTML与NG前缀属性。
在NG-初始化指令初始化AngularJS应用程序变量。
AngularJS例
<div ng-app="" ng-init="firstName='John'">
<p>The name is <span ng-bind="firstName"></span></p>
</div>
试一试» 或者用有效的HTML：
AngularJS例
<div data-ng-app="" data-ng-init="firstName='John'">
<p>The name is <span data-ng-bind="firstName"></span></p>
</div>
试一试»  | 您可以使用数据NG-，而不是NG-，如果你想使你的网页的HTML有效。 |
|---|
你会学到了很多有关指令，在本教程后面。
AngularJS表达式
AngularJS表达式双括号里面写：{{表达式}}。
AngularJS将“输出”的数据究竟在何处表达式写的是：
AngularJS例
<!DOCTYPE html>
<html>
<script
src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body>
<div ng-app="">
<p>My first expression: {{ 5 + 5 }}</p>
</div>
</body>
</html>
试一试» AngularJS表达式绑定AngularJS数据HTML的方式为NG-绑定指令相同。
AngularJS例
<!DOCTYPE html>
<html>
<script
src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body>
<div ng-app="">
<p>Name:
<input type="text" ng-model="name"></p>
<p>{{name}}</p>
</div>
</body>
</html>
试一试» 您将了解更多关于表达式在本教程后面。
AngularJS应用
AngularJS 模块定义AngularJS应用。
AngularJS 控制器控制AngularJS应用。
该NG-应用程序指令定义应用程序时，NG-控制器指令定义控制器。
AngularJS例
<div ng-app=" myApp " ng-controller=" myCtrl ">
First Name: <input type="text" ng-model="firstName"><br>
Last Name: <input type="text" ng-model="lastName"><br>
<br>
Full Name: {{firstName + " " + lastName}}
</div>
<script>
var app = angular.module(' myApp ', []);
app.controller(' myCtrl ',
function($scope) {
$scope.firstName= "John";
$scope.lastName= "Doe";
});
</script>
试一试» AngularJS模块定义的应用程序：
AngularJS模块
var app = angular.module('myApp', []);
AngularJS控制器控制应用：
AngularJS控制器
app.controller('myCtrl',
function($scope) {
$scope.firstName= "John";
$scope.lastName= "Doe";
});
您将了解更多关于模块和控制器在本教程的后面。