收集关于angular与JS的一些常见问题 总结

1：angularjs 指令中动态编译的方法(适用于有异步请求的情况) 内嵌指令无效

 

在directive的link中有一个$http请求，当请求完成后根据返回的值动态做element.append('......');这个操作，能显示没问题，可问题是我动态组的HTML里面有ng-click，发现显示出来的内容根本不执行ng-click绑定的方法！

这个是因为异步返回之后，指令的编译已经完成，因此需要动态编译。

使用$compile服务！ 在link方法中对返回后的html代码经过$compile服务处理后再插入：
var el=$compile("HTML代码")(scope); element.append(el);

 

以下是我根据后台返回数据创建HTML 插入dom

html

 

<div
    data-angular-treeview="true"
    data-tree-id="abc"
    data-tree-model="treedata"
    data-node-id="id"
    data-node-label="label"
    data-node-children="children" >
</div>

 

 

 

js

 

.directive( 'treeModel', ['$compile','$$ajaxCall', function( $compile,$$ajaxCall ) {
	return {
		restrict: 'A',
		link: function ( scope, element, attrs ) {
			var treeId = attrs.treeId;
			var treeModel = attrs.treeModel;
			var template =
				'<ul>' +
				'<li data-ng-repeat="node in ' + treeModel + '" data-ng-click="' + treeId + '.selectNodeHead(node,$event)" id="li_{
  {node[0]}}">' +
				'<i class="fa  expanded"  ng-class={true:"fa-plus-square-o",false:"fa-minus-square-o"}[!node.collapsed] ></i>' +
					'<span  folderName="{
  {node[1]}}" title="{
  {node[1]}}">{
  {node[1]}}</span>' +
						'<div data-ng-hide="!node.collapsed" id="Ch_{
  {node[0]}}">'+
						'</div>' +
					'</li>' +
				'</ul>';//生成一级树
			if( treeId && treeModel ) {
				if( attrs.angularTreeview ) {
					scope[treeId] = scope[treeId] || {};
					//点击事件
				scope[treeId].selectNodeHead = scope[treeId].selectNodeHead || function(selectedNode,e){
							scope.selectedNode=selectedNode[0]
							$$ajaxCall.getQuery("datasheetCellImage/getFileDataList?folderId="+selectedNode[0]+"&page="+scope.pageNum,"",function(data){
								childScope = scope.$new(); //新建一个域
								childScope.treedataCh =data[0]
								childScope.node=selectedNode;
								scope.linkDalFiles=data[1][1];
								scope.totalItems=data[1][0];
								var navStrArr = new Array()
								jQuery("span.selected").each(function(i,v){
									navStrArr.push(jQuery(this).attr("folderName"));
								})
							scope.linkDalFilesLevel = navStrArr.join(">");//生成上面的folderName
	
								var template2 =
									'<ul>' +
									'<li data-ng-repeat="node in treedataCh"  data-ng-click="' + treeId + '.selectNodeHead(node,$event)" id="li_{
  {node[0]}}">' +
									'<i class="fa  expanded"  ng-class={true:"fa