if (typeof(cf)=="function")
var IknowPageModify=falsevar UnloadConfirm=}}UnloadConfirm.clear=function()}UnloadConfirm.set()if(!G)return A}}function ctlSubmit(A)}function lockButton(A),3000)}function cReply(A)if(A=="no")}function fixReply(A)function showcpro(A)function ga(B,A)}}elset=h.id}if(t==a||p==a||r==a)window.open(G(a).href,"_blank")}}function ss(A)function cs()var query=(function()D.onsubmit=function()document.forms.ftop.appendChild(E(query.isChanged()))return true}}function A()return B!=document.forms.ftop.word.value}return})()function statFunc(A)function voteAnswer(A)function formSubmit(B,A),B),A||"deal")}var url = escape(location.href)IknowLogParams["page"]="ikqb"> > >
已解决
谁有PHP+JS的三级联动菜单啊~急用~~可以连接MYSQL数据库的 悬赏分:5 - 提问时间2006-12-9 15:44 提问者: -
angularjs处理动态菜单的实现方法:1、核心angularjs代码:
var testImg=angular.module("appTest",["ms.leafMenu"])
.controller('testCtr',['$scope',function($scope){
$scope.data=[{"id":"1","pid":"0","name":"第一行","children":[{"id":"3","pid":"1","name":"第一行1.1"},{"id":"4","pid":"1","name":"第一行1.2"}]},{"id":"2","pid":"0","name":"第二行","children":[{"id":"5","pid":"2","name":"第二行2.1"}]}]
}])
angular.module("ms.leafMenu",[])
.directive('msLeafMenu',['$compile',function($compile){
return {
restrict:'EA',
transclude: true,
replace: false,
//template:"<li></li>",
scope:{
data:'=?',
id:'@?',
pid:'@?',
pvalue:'@?',
showname:'@?',
isstandard:'@?'
},
link:function(scope,element,attrs,leafController){
创建节点数据的方法:
function createTreeData(id,pid,pvalue){
var newData=[]
angular.forEach(scope.data,function(item,index){
if(item[pid]==pvalue){
var children=createTreeData(id,pid,item[id])
if(children &&children.length>0){
item.children=children
}
newData.push(item)
}
})
return newData
}
if(!scope.isstandard){
scope.data=createTreeData(scope.id,scope.pid,scope.pvalue)
}
//向节点增加数据
element.append($compile('<ul class="ms_leaf_menu_group"><li ng-repeat="row in data" ng-class="{ms_parent_item:(row.children &&row.children.length>0),ms_child_item:(!row.children || row.children.length<=0)}"><div ng-click="toogle($index)"><a >{{row[showname]}}</a><span class="glyphicon" ng-class="{\'glyphicon-chevron-right\':(row.children &&row.children.length>0 &&!row.isopen),\'glyphicon-chevron-down\':(row.children &&row.children.length>0 && row.isopen)}" aria-hidden="true"></span></div><div ng-show="row.isopen"><ms-leaf-menu data="row.children" id="id" pid="pid" showname="{{showname}}" pvalue="{{row[id]}}"></ms-leaf-menu></div></li></ul>')(scope))
//此处是关键,调用入口处,需要找到index
scope.toogle=function(index){
scope.data[index]["isopen"]=!scope.data[index]["isopen"]
}
}
}
}])
</script>
2、html代码:
<body ng-app="appTest">
<div ng-controller="testCtr" style=" width:200pxmargin-left:automargin-right:auto">
<ms-leaf-menu data="data" id="id" pid="pid" showname="name" pvalue="0"></ms-leaf-menu>
</div>
</body>
望采纳,谢谢。
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)