首页 > 代码库 > angular js 中conpile与link应用与区别

angular js 中conpile与link应用与区别

技术分享

   link方法是compile抛出来的一个方法

应用

app.directive("thumbNail",function(){
return{
restrict:"ACE",
replace:true,
templateUrl:"../tpl/tpl.html",
compile:function(elem,attrs,transclude){
// dom dom 树的增删改查(此时dom树还未形成)
console.log("编译阶段"); //只打印一次只执行一次
return{
pre:function(scope,elem,attrs,controller){
            //  dom dom 树的增删改查(此时dom树还未形成)实际上也打印了6次 相当于post-link方法


console.log("编译阶段1")
                },
post:function(scope,elem,attrs,controller){ //相当于post-link方法
console.log("链接阶段") //绑定事件与数据(dom树已形成 ) 每个实例都会执行一次
}

}
}
/*link:function(scope,elem,attrs){
console.log(elem);
angular.element(elem).find("a").eq(0).on("click",function(){
alert("加入收藏")
});
angular.element(elem).find("a").eq(1).on("click",function(){
alert("点击购买")
})
}*/
}
});

angular js 中conpile与link应用与区别