1、表达式{{ }}中不能使用流程控制语句if,else
2、angular依赖注入有两种方式:
①推断式注入
.controller("myCtrl",function($scope){
//.....
})
②内联式注入
.controller("myCtrl",["$scope",function($scope){
//.....
}])
区别:推断式注入不支持代码的压缩混淆,否则会报错。推荐使用第二种内联式注入。
3、作用域$scope和$rootScope
$rootScope是根作用域,从ng-app所在的标签处开始存在
作用域默认是原型式继承父作用域(除了隔离作用域),最终继承自$rootScope
4、自定义过滤器
.filter("myFilter",["$scope",function($scope){
return function(val){
//....
return ...
}
}])
5、自定义指令
.directive("myDirective",function(){
return {
//指令配置项
template:"",
templateUrl:"",
replace:true,
restrict:"ECMA",
controller:function($scope){
//...
},
transclude:true,
scope:{},
link:function(scope,ele,attrs,ctrl){
//...
},
require:"?^directiveName",
}
})
指令配置项:
①template是模板内容,有两种方式:
(1)直接定义模板
(2)定义一个方法,返回模板,但是要注意方法中一定要返回模板
template:function(tEle,tAttrs){
tEle[0].setAttribute("name","value");
//....
return "<h1>指令</h1>";
}
其中,tEle指的是指令<my-directive> </my-directive> ,tAttrs是其属性
②templateUrl是模板路径,也有两种方式:
(1)直接定义模板路径
(2)定义一个方法,返回模板路径,但是要注意方法中一定要返回模板路径
③replace表示模板是否替换指令元素
④restrict表示指令可以用作标签、class、注释、属性使用
⑤controller即指令要使用的控制器,可以是已经注册好的控制器(字符串)或者定义一个方法
⑥transclude表示指令内部的东西是否保留
⑦scope指令的作用域,有三种值:
(1)false,默认值,表示继承父作用域,但是可以修改父作用域的值,不推荐。
(2)true,只是纯粹的继承父作用域属性,形成自己的私有作用域,不会改变父作用域的属性。
(3)对象{ },表示创建一个隔离作用域,但我们可以使用前缀符进行绑定父作用域的某些属性,有三种:
<1> @, 单向绑定,绑定父作用域的属性
<2> =, 双向绑定,变量绑定
<3> &, 方法传递,将父作用域的方法传递给当前指令,指令调用方法时还可以传入参数,但必须是对象,对象以键值对的形式,键要和父作用域的属性绑定的方法的形参一致。
scope:{
childName:"@parentName"
childName:"=parentName"
childFun:"&parentFun"
}
⑧link,生命周期的连接阶段,进行数据与dom的绑定,参数有四个:scope是当前指令所在的作用域、ele是当前指令、attrs是当前指令的属性、ctrl是link函数要使用的其他指令的控制器,只有在require为true时才生效。
⑨require用作指令间的通信,引入其他指令
前缀 ? 表示在当前指令中没有找到所需要的控制器时,将null传给link函数的第四个参数
前缀 ^ 表示在指令的上层中查找指定的控制器
6、$http服务
$http服务是对浏览器原生的XMLHttpRequest对象进行了封装
在调用$http方法后,返回一个promise对象
$http({
url:"",
method:""
}).then(function(res){
//...
console.log(res.data);
})
注意:$http.jsonp()发送JSONP请求,url地址中必须包含JSON_CALLBACK
eg:$http.jsonp("./data.json?callback=JSON_CALLBACK")
7、脏检查
脏查询触发:controller初始化、ng开头的指令、事件被执行后等
手动触发脏查询:
$scope.$apply(function(){
//...要发生变化的内容
})
监听:
$scope.$watch("name",function(newVal,oldVal){
//...监听属性变化
})
8、常用的依赖注入
controller、service、factory、constant、config、value、provider等
只有controller可以注入$scope,其他都不可,但它们可以注入$rootScope
service是单例的,更适合做数据的持久化,与后台进行通信
constant和provider可以注入到config中,provider可以被注入到任何地方