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
