AngularJS 模块

模块名 描述
ng

AngularJS的默认模块，包含AngularJS的所有核心组件。
ngRoute

AngularJS是一套前端的MVC框架。那么，为了实现视图的中转，肯定会涉及到路由的概念。ngRoute即是AngularJS的路由模块。
ngAnimate

AngularJS的动画模块，使用ngAnimate各种核心指令能为你的应用程序提供动画效果。动画可使用css或者JavaScript回调函数。
ngAria

使用ngaria为指令注入共同的可达性属性和提高残疾人用户体验。
ngResource

当查询和发送数据到一个REST 服务器时，使用ngResource模块。
ngCookies

ngCookies模块提供了一个方便的包用于读取和写入浏览器的cookies。
ngTouch

ngRoute模块提供触摸事件，方便的应用于移动触摸设备。它的实现是实现是基于jQuery移动触摸事件处理。
ngSanitize

ngSanitize模块可安全地在你的应用程序中解析和操作HTML数据。
ngMessages

AngularJS表单验证模块。ngMessages模块完美的实现了很多表单验证的常用功能，简化你的开发流程。

一个Hello word程序

<!doctype html>
<html ng-app>
  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>
  </head>
  <body>
    <div>
      <label>Name:</label>
      <input type="text" ng-model="yourName" placeholder="Enter a name here">
      <hr>
      <h1>Hello {{yourName}}!</h1>
    </div>
  </body>
</html>

在右边文本框输入"world"，是否看到了神奇的一幕。没错，这就是AngularJS的双向数据绑定。

现在让我们仔细看看代码，看看到底怎么回事。

首先引入AngularJS的头文件。

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>

当加载该页时，标记ng-app告诉AngularJS处理整个HTML页并引导应用：

<html ng-app>

指令ng-model将<input>输入的值绑定到了变量yourname。

<h1>Hello {{yourName}}!</h1>

angularjs表达式用双括号{{ }}形式表示，他会对包裹的yourname变量进行解析。指令ng-model一将<input>输入的值绑定到了变量yourname，{{yourname}}就解析出来了。这个过程是同步的，而且是双向的。