在directive的link中有一个$http请求，当请求完成后根据返回的值动态做element.append('......');这个操作，能显示没问题，可问题是我动态组的HTML里面有ng-click，发现显示出来的内容根本不执行ng-click绑定的方法！
这个是因为异步返回之后，指令的编译已经完成，因此需要动态编译。
使用$compile服务！ 在link方法中对返回后的html代码经过$compile服务处理后再插入：
var el=$compile("HTML代码")(scope); element.append(el);
<script>
var app=angular.module('app1',[]);
app.controller('ctr',['$scope',function($scope){
}])
app.directive('myDire',function($compile){
return{
restrict:'AE',
template:"<div>\
<div class='box'>我是父亲</div>\
<p style='width:60px; height:30px; border:1px solid red; display:inline-block; float:left; text-align:center; line-height:30px;' ng-click='child(1)''>我是1</p>\
<p style='width:60px; height:30px; border:1px solid red; display:inline-block; float:left;text-align:center; line-height:30px;' ng-click='child(2)'>我是2</p>\
</div>",
link:function($scope,$element,attr){
/*child :function(){
console.log(1)
}*/
$scope.child=function(num){
var box=$element.find('.box');
var chile=$compile('<div child-dire'+num+'></div>')($scope);
box.html(chile);
//box.append(chile);
}
}
}
})
app.directive('childDire1',function(){
return{
restrict:'AE',
template:'<div>我是孩子1</div>'
}
})
app.directive('childDire2',function(){
return{
restrict:'AE',
template:'<div>我是孩子2</div>'
}
})
</script>
