AngularJS 通过 指令 扩展了 HTML，且通过 表达式 绑定数据到 HTML。
【Angular JS表达式】
1、Angular JS使用双{ {}}绑定方式。用于将表达式的内容输出到页面中。 表达式可以是文字、运算符、变量等，也可以在表达式中进行运算输出结果 eg. <p>{ { 5+5+"Angular" }}</p> 如果Angular.js文件放在文件下方，在页面刷新的瞬间看到{ {}}表达式，可以使用<div ng-bind="name"></div>方式绑定 eg.上式可以改为：<p ng-bind="5+5+'Angular' "></p>{
{ 5+5+"Angular" }} >
示意图
【AngularJS 常用指令】
AngularJS 指令是扩展的 HTML 属性，带有前缀 ng-。 1、ng-app：AngularJS所管辖的区域。一般写在body或HTML标签上，原则上一个页面只能有一个 eg. <body ng-app=""></body> 2、ng-model ：把元素值（比如输入域的值）绑定到应用程序的变量中。 eg.<input type="text" ng-model = "name" /> 3、ng-bind：把应用程序变量中的值，输出到页面HTML视图中。可以与表达式{ {}}互相替换。 eg.<div ng-bind="name"></div> 4、ng-init：初始化AngularJS应用程序中的变量值； eg. <body ng-app="" ng-init=" name='jredu' "> 应用程序初始化时，name变量就赋有初值。{ {name+"123"}}
示意图
【MVC 三层架构】
1、Model（模型层）:应用程序中用于处理数据的部分（包括将数据保存或者修改到数据库、变量文件中）。 在AngularJS中，Model 特指的是 应用程序中的各种数据。 View（视图层）：用户可以看到的用于显示数据的页面。（只有view是用户可见的） Controller（控制器）：是链接Model和View的桥梁，负责从view读取数据、接收用户的操作输入；并将数据发送给model层。 model对数据处理完毕后，将结果返回给 Controller，Controller再将结果返回给View层显示。如何 创建一个angular的模块，即ng-app="" 需要绑定的部分？
需要接收两个参数： eg. var app = angular.module("myApp",[]); ① 模块名称：即 angular.module 双引号中绑定的名字。 ② 数组：表示需要注入的模块名称，不需要注入其他模块，可用空数组代替。 >>> Angular（2.0）将常用放入功能封装在angular.js，创建主模块时可以直接使用，无需注入。 >>>而一些应用较少的功能，需要导入相应的JS文件，并且在[]中注入进这个模块，才可以使用。 这就是AngularJS（1.0）中的【模块开发】和【依赖注入】。如何 在AngularJS模块上，创建一个控制器？
需要传入两个参数：
① 控制器名字：即ng-controller需要绑定的名字 <div ng-controller="myCtrol"> ② 控制器的构造函数，构造函数可以传入多个参数 >>>如果又在函数中使用系统的内置对象，则必须通过函数的参数传入，否则不能使用 >>>AngularJS 中的内置对象，都用$开头，例如 $scope,$rootScope【AngularJS的作用域】
① $scope：局部作用域，声明在$scope上的属性和方法，只能在当前的Controller使用； ② $rootScope：根作用域，声明在$scope上的属性和方法，可以在整个ng-app所含范围内使用。 >>>如果没有使用 $scope 声明变量，而是直接使用ng-model在HTML标签中绑定的数据的作用域为： 1、如果ng-mode写在某个 Controller 中，则这个变量会默认绑定到当前的Controller的$scope上； 2、如果ng-mode没有写在任何一个 Controller 中，则这个变量会默认绑定到 Controller的 $rootScope 上；【注】 AngularJS中的父子作用域
1、AngularJS中，子作用域只能访问父作用域中的变量，二不能修改父作用域的变量； 2、为了解决上述问题，可以将副作用域中的变量声明为引用数据类型，例如对象等。 这样可以在子作用域中，直接修改对象属性，而不需要修改对象本身保存的地址。 见"myCtrol1"举例示意图
【AngularJS中的过滤器】
过滤器可以使用一个管道字符（|）添加到表达式和指令中。 1、系统内置的过滤器 currency：将数字格式化为货币形式。 filter：从数组项中选择一个子集。 orderBy：根据某个表达式排列数组。 lowercase：格式化字符串为小写。 uppercase：格式化字符串为大写。2、自定义过滤器（写在控制器外面） ，同时 需要传递过滤参数。 调用过滤器实例： 传入参数4，将被 过滤函数 的 num形参 所接收。
【AngularJS中的服务Service】
1、内置服务： 要是服务，必须要把服务名通过controller的构造函数的参数注入进来！ 服务内置的服务，统一使用$开头，服务中的属性和方法统一使用$$开头！自定义服务时，需注意与系统服务的写法区分开 $location：返回当前页面的URL地址信息，第一个对象。 $http：向服务器发送请求，应用响应服务器传送过来的数据。相当于JQuery中的Ajax $timeout：相当于setTimeout();2、自定义服务 第一个参数是 服务名; 第二个参数是自定义服务的构造函数。我们自定义的服务，本质是一个对象。 对象的属性，可以在构造函数中，使用this.属性表示； 对象的方法，可以在构造函数中，使用this.方法表示；
示意图
【AngularJS中的DOM和事件】
1、DOM
ng-disabled="false" 传入true表示禁用，传入false表示可用
ng-show="false" 传入true表示显示，传入false表示隐藏 ng-hide="false" 传入true表示隐藏，传入false表示显示2、AngularJS中的事件 只能触发绑定在AngularJS作用域上的属性和方法。
{
{myCheck}}哈哈，来咯！
呜呜，拜拜！
示意图
【AngularJS的表单验证】
1、表单中，常用的验证操作： $dirty 表单有填写记录 $valid 字段内容合法的 $invalid 字段内容是非法的 $pristine 表单没有填写记录 $error 表单验证不通过的错误信息 2、验证时，必须给form和input，设置name属性。 给form和input设置name后，会自动将表单信息绑定到$scope 作用域中。所以，可以直接使用formName.inputName.$验证操作 得到验证结果 eg. formName.inputName.$dirty = "true" 表示表单被填写过 formName.inputName.$invalid = "true" 表示表单输入内容不合法 formName.inputName.$error.required= "true" 表示表单设置了必填，但是没有输入 【注】$error 支持的验证 required/minlength/maxlength/partten/email/number/data/url等 3、为了避免AngularJS的验证与HTML5的验证表单冲突！例如，type = "email" required等，H5也会进行验证，可以给form添加 "novalidate" 属性，禁用HTML5的验证功能。用户名验证功能——代码举例 ↓↓↓
示意图
【AngularJS中使用动画】
1、导入angular-animate.js 2、 如果页面中没有自定义app模块，则可以直接绑定系统模块ng-app="ngAnimate" 如果页面中有自定义的app模块，则可以在自定义模块的数组中，注入ngAnimate。 angular.module("app",["ngAnimate"]) 3、 当使用ng-show、ng-hide显示或者隐藏元素的时候， 系统会自动添加或者移除.ng-hide这个class类； 4、 当使用ng-if/ng-switch/ng-repeat等其他指令，需要分别设置显示后和隐藏后的两种class样式： 显示后的class： .ng-enter-active,.ng-leave{} 隐藏后的class： .ng-enter,.ng-leave-active{}隐藏div这是一个div移除div这是一个div
动画效果 渐变消失
今天就到这里吧，后续还会更新...
如果有疑问可以提出来大家共同解决，如果有不完善的地方还请多多指正！
有需要请加关注呦~~~蟹蟹~~~