Angular.js是一款优秀的前端MVVM（Model View View Model）框架。诞生于2009年，后来被谷歌收购。
版本
目前最新的版本是Angular.js4.0，但本文中使用的为1.5.3，基本是通用版本。
主要是因为angularjs在2.0使用typescript的语法编写。typescript也可以说成是C#语言编写后再通过转编译成js代码的一个编译器。
初始化
- ng-app
在html标签中添加这个属性可以直接初始化angular.js，当然只是简单的应用。
<div ng-app>
<p>{{ 2+3 }}</p>
</div>
在网页中显示：
5
花括号中数据会被angular识别，进行处理。
如果要进行进一步的操作，就必须要给它取个名字：ng-app="app"。
然后，js中初始化
var app=angular.module('app',[]);
[]中是这个app的注入依赖，当需要额外的功能时可以添加，但空数组必须存在。
作用域
在angular中有全局作用域，以及局部作用域；
- 全局作用域通过run方法进行声明；
app.run(function($rootScope){
$rootScope.box = '我是全局的属性'; //定义一个全局的作用域
})
这种写法下传入的形参必须写死：$rootScope。
另外一种写法：
app.run('$rootScope',function(root){
root.box = '我是全局的属性'; //定义一个全局的作用域
})
这种方式下，形参就可以随意书写;
- 局部作用域
Angular中的局部作用域需要通过初始化一个控制器来实现；
先在html中绑定控制器;
<div class="wrapper" ng-controller="wrapper">
然后在初始化控制器;
app.controller('wrapper', ['$scope',function(scope){
scope.name = '67';
scope.yui = 890;
scope.color = 'red';
}])
也可以写成：
app.controller('wrapper',function($scope){
scope.name = '67';
scope.yui = 890;
scope.color = 'red';
})
与函数作用域相同，如果这个局部作用域中找不到这个属性或者方法时，它就会先在父级作用域中查找，然后一级一级往上，在全局作用域中查找；
ng-model
表单中的变量通过ng-model来声明
<input type="text" ng-model="value">
<p>{{value}}</p>
这样改变表单值的同时，P标签的文本内容同时也改变了
ng-repeat
可以遍历我们的dom结构
首先，写个数组：
<script>
$scope.list = [{
name: 1,
age: 18
},{
name: 2,
age: 18
},{
name: 3,
age: 18
},{
name: 4,
age: 18
}]
</script>
item就是这个数组的每一项；
<li ng-repeat="item in list">
{{item.name}}---{{item.age}}
</li>
结果就是这样：
- 1---18
- 2---18
- 3---18
- 4---18
如果数组值都是一样的
<script>
$scope.arr = [1,1,1,1,1,1,1,1]
</script>
就必须在后面加入track by $index
<li ng-repeat="item in arr track by $index">
{{item}}
</li>
结果：
- 1
- 1
- 1
- 1
- 1
- 1
- 1
- 1
ng-click
绑定点击事件执行的函数
<button ng-click="show()">显示</button >
ng-show
传入布尔值，是否显示元素。
<div ng-show="visible" class="box" style="width: 200px;height: 200px;><div>
最后写个函数
<script>
$scope.visibel=true;
$scope.show=function(){
$scope.visibel=!$scope.visibel;
}
</script>
