AngularJS 表达式
AngularJS 表达式写在双大括号内：{ { expression }}。
AngularJS 表达式把数据绑定到 HTML，这与 ng-bind 指令有异曲同工之妙。
AngularJS 将在表达式书写的位置"输出"数据。
AngularJS 表达式 很像 JavaScript 表达式：它们可以包含文字、运算符和变量。
运算式1+2、对象obj.name、数组str[1]都可以！
另：表达式支持过滤器,
用法：{
{expression || filter}}；AngularJS 指令
AngularJS 通过被称为 指令 的新属性来扩展 HTML。
AngularJS 通过内置的指令来为应用添加功能。
AngularJS 允许你自定义指令
ng指令详情表：
| 定义应用程序的根元素。 | |
| 绑定 HTML 元素到应用程序数据 | |
| 绑定 HTML 元素的 innerHTML 到应用程序数据，并移除 HTML 字符串中危险字符 | |
| 规定要使用模板替换的文本内容 | |
| 规定 blur 事件的行为 | |
| 规定在内容改变时要执行的表达式 | |
| 规定元素是否被选中 | |
| 指定 HTML 元素使用的 CSS 类 | |
| 类似 ng-class，但只在偶数行起作用 | |
| 类似 ng-class，但只在奇数行起作用 | |
| 定义元素被点击时的行为 | |
| 在应用正要加载时防止其闪烁 | |
| 定义应用的控制器对象 | |
| 规定拷贝事件的行为 | |
| 修改内容的安全策略 | |
| 规定剪切事件的行为 | |
| 规定双击事件的行为 | |
| 规定一个元素是否被禁用 | |
| 规定聚焦事件的行为 | |
| ng-form | 指定 HTML 表单继承控制器表单 |
| 隐藏或显示 HTML 元素 | |
| 为 the <a> 元素指定链接 | |
| 如果条件为 false 移除 HTML 元素 | |
| 在应用中包含 HTML 文件 | |
| 定义应用的初始化值 | |
| ng-jq | 定义应用必须使用到的库，如：jQuery |
| 规定按下按键事件的行为 | |
| 规定按下按键事件的行为 | |
| 规定松开按键事件的行为 | |
| 将文本转换为列表 (数组) | |
| 绑定 HTML 控制器的值到应用数据 | |
| 规定如何更新模型 | |
| 规定按下鼠标按键时的行为 | |
| 规定鼠标指针穿过元素时的行为 | |
| 规定鼠标指针离开元素时的行为 | |
| 规定鼠标指针在指定的元素中移动时的行为 | |
| 规定鼠标指针位于元素上方时的行为 | |
| 规定当在元素上松开鼠标按钮时的行为 | |
| 规定元素或子元素不能绑定数据 | |
| 指定元素的 open 属性 | |
| 在 <select> 列表中指定 <options> | |
| 规定粘贴事件的行为 | |
| ng-pluralize | 根据本地化规则显示信息 |
| 指定元素的 readonly 属性 | |
| 定义集合中每项数据的模板 | |
| 指定元素的 selected 属性 | |
| 显示或隐藏 HTML 元素 | |
| 指定 <img> 元素的 src 属性 | |
| 指定 <img> 元素的 srcset 属性 | |
| 指定元素的 style 属性 | |
| 规定 onsubmit 事件发生时执行的表达式 | |
| 规定显示或隐藏子元素的条件 | |
| ng-transclude | 规定填充的目标位置 |
| 规定 input 元素的值 |
创建自定义的指令
除了 AngularJS 内置的指令外，我们还可以创建自定义指令。
你可以使用 .directive 函数来添加自定义的指令。
要调用自定义指令，HTML 元素上需要添加自定义指令名。
使用驼峰法来命名一个指令， runoobDirective, 但在使用它时需要以 - 分割, runoob-directive:
AngularJS ng-model 指令
ng-model 指令用于绑定应用程序数据到 HTML 控制器(input, select, textarea)的值。
ng-model 指令可以将输入域的值与 AngularJS 创建的变量绑定。
双向绑定，在修改输入域的值时， AngularJS 属性的值也将修改：
支持用户验证（感觉很low）
<form ng-app="" name="myForm"> Email: <input type="email" name="myAddress" ng-model="text"> <span ng-show="myForm.myAddress.$error.email">不是一个合法的邮箱地址</span></form>
以上实例中，提示信息会在 ng-show 属性返回 true 的情况下显示。
ng-model 指令可以为应用数据提供状态值(invalid, dirty, touched, error):
(表单验证应该是个大头)
ng-model 指令根据表单域的状态添加/移除以下类：
- ng-empty 为空
- ng-not-empty 不为空
- ng-touched 点击
- ng-untouched 未点击
- ng-valid 合法
- ng-invalid 不合法
- ng-dirty 改变时
- ng-pending
- ng-pristine 初始状态
AngularJS Scope(作用域)
Scope(作用域) 是应用在 HTML (视图) 和 JavaScript (控制器)之间的纽带。
Scope 是一个对象$scope，有可用的方法和属性。
Scope 可应用在视图view和控制器controller上。
最简单的实例：
当在控制器myCtrl中通过Fn添加 $scope 对象时，视图 (HTML) 中的{
{expression}}可以获取了这些属性。视图中，你也不需要添加 $scope 前缀, 只需要添加属性名即可，如： { {carname}}。
Scope 作用范围
controller指定的 $scope的作用范围，在多个DOM下有点昏！！！
根作用域
所有的应用都有一个 $rootScope，它可以作用在 ng-app 指令包含的所有 HTML 元素中。
$rootScope 可作用于整个应用中。是各个 controller 中 scope 的桥梁。用 rootscope 定义的值，可以在各个 controller 中使用
（类似于js的构造函数厉害prototype扩展属性和方法一样，后面所有实例化都继承了扩展的属性和方法）
AngularJS 控制器
AngularJS 控制器 控制 AngularJS 应用程序的数据。
AngularJS 控制器是常规的 JavaScript 对象。
ng-controller 指令定义了应用程序控制器。
控制器是 JavaScript 对象，由标准的 JavaScript 对象的构造函数 创建
最基本的应用帮助关系梳理：
<div ng-app="myApp" ng-controller="myCtrl">名: <input type="text" ng-model="firstName"><br>姓: <input type="text" ng-model="lastName"><br><br>姓名: { {firstName + " " + lastName}}</div><script>var app = angular.module('myApp', []);app.controller('myCtrl', function($scope) { $scope.firstName = "John"; $scope.lastName = "Doe";});</script>
应用解析：
AngularJS 应用程序由 ng-app 定义。应用程序在 <div> 内运行。
ng-controller="myCtrl" 属性是一个 AngularJS 指令。用于定义一个控制器。
myCtrl 函数是一个 JavaScript 函数。
AngularJS 使用$scope 对象来调用控制器。
在 AngularJS 中， $scope 是一个应用对象(属于应用变量和函数)。
控制器的 $scope （相当于作用域、控制范围）用来保存AngularJS Model(模型)的对象。
控制器在作用域中创建了两个属性 (firstName 和 lastName)。
ng-model 指令绑定输入域到控制器的属性（firstName 和 lastName）。
也可以是对象{}，包括数组[],对象数组[{},{}]等等。
AngularJS 过滤器
过滤器可以使用一个管道字符（|）添加到表达式和指令中。
（应该是最简单，最好理解的一块了）
大类有5：
| currency | 格式化数字为货币格式。 |
| filter | 从数组项中选择一个子集。 |
| lowercase | 格式化字符串为小写。 |
| orderBy | 根据某个表达式排列数组。 |
| uppercase | 格式化字符串为大写。 |
具体用法：
{ { "lower cap string" | uppercase }} // 结果：LOWER CAP STRING { { "TANK is GOOD" | lowercase }} // 结果：tank is good { { 1490161945000 | date:"yyyy-MM-dd HH:mm:ss"}} // 2017-03-22 13:52:25 { { 149016.1945000 | number:2}}保留小数位数 { { 250 | currency }} // 结果：$250.00 { { 250 | currency:"RMB ￥ " }} // 结果：RMB ￥ 250.00 输入过滤器可以通过一个管道字符（|）和一个过滤器添加到指令中，该过滤器后跟一个冒号和一个模型名称。 { { [{ "age": 20,"id": 10,"name": "iphone"}, { "age": 12,"id": 11,"name": "sunm xing"}, { "age": 44,"id": 12,"name": "test abc"} ] | filter:{ 'name':'iphone'} }} { { "1234567890" | limitTo :6}} // 从前面开始截取6位 { { "1234567890" | limitTo:-4}} // 从后面开始截取4位 // 根据id升序排{ { [{ "age": 20,"id": 10,"name": "iphone"}, { "age": 12,"id": 11,"name": "sunm xing"}, { "age": 44,"id": 12,"name": "test abc"} ] | orderBy:'id' }} //降序加个冒号true orderBy:'id':true