使用Angular

• angular是一个框架（框架包含类库）
  • 类库：函数的集合。jquery.
• angular是做什么的？
• 解决原生html不足。增加一些指令。
• 什么是指令？
• 给原生的html标签添加了一些新的属性，达到自己想要的效果 。
• jquery能不能与angular共存。（可以）
• jquery用来做特效做DOM操作，以dom驱动。angular是以数据为驱动。
• MVC:
  模型（Model）
  视图(View)
  控制器(Controller)
• 定义模块

<script>
    //1.创建模块（model的第二个参数写和不写完全不同。）
    // 当写上时：代表是创建一个模块。不写：获取指定的模块。
    //模块相当于一个餐厅
    var app = angular.module("app",[]);
    //2.创建控制器
    //控制器相当于服务员
    //$scope相当于餐厅里的厨房（厨房可以放东西，做菜等）(一个功能，服务)
    app.controller("XmgController",["$scope", function ($scope) {
        $scope.name ="xigua";
        $scope.box =["apple","banana"];
        $scope.doFood = function () {
            alert("zuofan")
        }
    }])
    //3.绑定模块。 让anguar在当前页当中支持范围。
    //4.绑定控制器
</script>

指令

ng-app 指定应用根元素，至少有一个元素指定了此属性。
ng-controller 指定控制器
ng-show控制元素是否显示，true显示、false不显示
ng-hide控制元素是否隐藏，true隐藏、false不隐藏
ng-if控制元素是否“存在”，true存在、false不存在
ng-src增强图片路径
ng-href增强地址
ng-class控制类名
ng-include引入模板
ng-disabled表单禁用
ng-readonly表单只读
ng-checked单/复选框表单选中
ng-selected下拉框表单选中

• ng-show/hide和ng-if的区别
• ng-show/hide 控制标签是否显示
• ng-if 控制器标签是否存在
• 直接使用src加载图片，会带来什么问题？
• 由于加载是先把Html页面加载完成之后，再回头来加载angular。所以只是用src会发送两次请求，所以第一次请求会出现404错误。

自定义指令

• AngularJS允许根据实际业务需要自定义指令，通过angular全局对象下的directive方法实现。

  
  

数据绑定（MVVM）

• 数据单向绑定（MV）：把模型的数据展示到视图当中。
• 绑定方式有三种:
• 1.使用插值语法:{{模型属性}} 加载时，->会造成闪烁。可以使用ng-cloak来避免闪烁
• 2.使用ng-bind:ng-bind=“模型属性” ->不会造成闪烁, 只能绑定一个属性
• 3.使用ng-bind-template=“{{模型属性}},{{模型属性}}”->可以绑定多值, 不会千万闪烁
• 在数据绑定过程当中使用插值语法绑定数据时，会造成闪烁。请求是什么原因？如何解决？
• 原因：由于加载是先把Html页面加载完成之后，再回头来加载angular。所以会发送两次请求。
• 解决：
  1.在标签当中添加指令 ng-cloak
  2.定义样式【ng-cload】 内容为display:none
  3.解析html时会把指令的标签给隐藏。
  4.在解析angular时会把ng-cloak样式改为显示。
• 数据双向绑定（VM）:
  视图的数据可以绑定到模型当中。
  模型的数据可以绑定到视图当中。

过滤器

• 什么事过滤器：对数据进行格式化处理。
• 过滤器的本质：就是一个方法
• 把管道符左边的内容当作参数传给右边
  abc | currency
• 内置9大过滤器
  1、currency:将数值格式化为货币格式
  2、date:日期格式化，年（y）、月（M）、日（d）、星期（EEEE/EEE）、时（H/h）、分（m）、秒（s）、毫秒（.sss），也可以组合到一起使用。
  3、filter:在给定数组中选择满足条件的一个子集，并返回一个新数组，其条件可以是一个字符串、对象、函数
  4、json:将Javascrip对象转成JSON字符串。
  5、limitTo:取出字符串或数组的前（正数）几位或后（负数）几位
  6、lowercase:将文本转换成小写格式
  7、uppercase:将文本转换成大写格式
  8、number:数字格式化，可控制小位位数
  9、orderBy:对数组进行排序，第2个参数可控制方向

• 如何自定义过滤器

  
  

依赖注入

• 行内式注入
  以数组形式明确声明依赖，数组元素都是包含依赖名称的字符串，数组最后一个元素是依赖注入的目标函数。推荐使用行内式注入.