AngularJS 简介

简介

AngularJS 是一个 JavaScript 框架
AngularJS 通过 指令 扩展了 HTML，且通过 表达式 绑定数据到 HTML
AngularJS表达式可以写在HTML里面
AngularJS表达式不支持条件和循环语句，而且没有exception语句
AngularJS表达式支持过滤器

AngularJS 应用组成

View(视图), 即 HTML
Model(模型), 当前视图中可用的数据($scope/$rootScope)
Controller(控制器), 即 JavaScript 函数，可以添加或修改属性

指令

AngularJS 通过 ng-directives 扩展了 HTML
AngularJS 指令是以 ng 作为前缀的 HTML 属性
ng-app 指令定义一个 AngularJS 应用程序
ng-controller 定义了控制器
注：一个页面只能有一个ng-app，可以有多个ng-controller
ng-model 指令把元素值（比如输入域的值）绑定到应用程序，可以为应用数据提供状态值(invalid, dirty, touched, error)
ng-bind 指令把应用程序数据绑定到 HTML 视图（双向绑定）
ng-init 指令初始化 AngularJS 应用程序变量
ng-repeat 指令让每个重复项都访问了当前的重复对象，对于集合中（数组中）的每个项会 克隆一次 HTML 元素
ng-show 指令验证用户输入
ng-invalid 指令，处理当数据不合法的时候
详细指令查询：http://www.runoob.com/angularjs/angularjs-reference.html

表达式

AngularJS 表达式写在双大括号内：{{ expression }}
AngularJS 表达式把数据绑定到 HTML（双向绑定），这与 ng-bind 指令有异曲同工之妙
AngularJS 表达式 很像 JavaScript 表达式：它们可以包含文字、运算符和变量

示例

ng-app不可省略
ng-init初始化变量
ng-bind绑定变量，显示

    
姓名为 

```
AngularJS 表达式使用
```html

     
名字 : 
     
Hello {{name}}

```
ng-controller指令定义了应用程序控制器，控制器是 JavaScript 对象，由标准的 JavaScript 对象的构造函数 创建（如下）   
$scope（相当于作用域、控制范围）用来保存AngularJS Model(模型)的对象    
控制器也可以有方法（变量和函数），调用fullName这个方法需要括号  
```html
尝试修改以下表单。

    名: 

    姓: 

    

    姓名: {{firstName + " " + lastName}}
    

    全名: {{fullName()}}



```
验证用户输入
```html

    Email:
    
    不是一个合法的邮箱地址

在输入框中输入你的邮箱地址，如果不是一个合法的邮箱地址，会弹出提示信息。
```
ng-invalid与required合用，在数据合理/不合理的两种情况下，显示不同效果
```html


    输入你的名字:
    

编辑文本域，不同状态边框颜色会发送变化。
文本域添加了 required 属性，该值是必须的，如果为空则是不合法的。
```

摘自：http://www.runoob.com/angularjs/angularjs-intro.html