Angular.js复习笔记2

angular的特点

 1.依赖注入[参数跟顺序无关,参数写死];

 2.双向数据绑定;

   数据名称一样,就会相互影响;

-------------------------------------------------------------------------------------------------------

多个控制器之间的数据会继承:

 继承看DOM结构;

 子集给父级发送数据:

   $scope.$emit('dataname',data);

   接收数据:

     $scope.$on('dataname',function(event,data){

       //data就是接收到的数据;

     });

 父级给子集发送数据:

   $scope.$broadcast('dataname',data);

   接收数据:

     $scope.$on('dataname',function(event,data){

       //data就是接收到的数据;

     })

数据脏检查:

 $scope.$apply();

 强制更新数据;

 $timeout;

 $interval;

过滤器:

 数据经过angular的包装之后再输出;

 {{data|currency}} 货币符号,

   {{data|currency:'传递的参数'}}

 {{data|number}}: 千分位

 {{str|lowercase}}: 转小写

 {{str|}}uppercase: 转大写

 {{data|orderBy}}: 排序

 {{arr|limitTo}}:3 : 截取

 {{date|date:'yyy-MM-dd hh:mm:ss EEEE'}}: 把时间戳转换为具体日期输出;

 {{data|filter:data}} : 过滤数据

---------------------------------------------------------------------------------------------------------

自定义过滤器:

 app.filter('过滤器的名字',function(){

   return function(input){

     //input:代表传递进来的那个参数

   }

 });

2017/05/12 10:50

angular指令[directive]:

 扩展html语法;

 ng-init=""

 ng-click=""

 ng-model=""

 ng-bind="";

 ······

自定义指令:

 ng-red

 //指令名称: 必须是驼峰命名法;

 app.directive('指令名称',function(){

   return {

     link: function(scope,element,attr){},

     restrict: 'ECMA',

       //E:element;元素

       //C:class： class

       //M:comment： 注释,必须配合replace使用;

       //A:attribute: 属性

     replace: true,

     template: 'code'//模板;

     templateUrl:'url'

   }

 });

 模板两种写法:

   template: 'code';

   templateUrl:'navTmp'

     为了减少请求，建议把模板写在当前页面;以ID形式接收;

     

//html code

------------------------------------------------------------------

定义控制器的另外一种方法:

 好处在于压缩后依然可以使用:

   app.controller('test',['']);

 angular.module('mk',[],function($controllerProvider){

   $controllerProvider.register('控制器的名字',function($scope){

     $scope.data = value;

   });

 });---->压缩之后会出问题;

https://developers.google.com/web/

http://tool.sufeinet.com/Code/Gzip.aspx

grunt

gulp