angular ztree 梯形结构json配置、点击节点事件、默认展开所有

时间:2023-03-09 09:55:15
angular ztree 梯形结构json配置、点击节点事件、默认展开所有
// 获取树数据
$scope.initZtreeData = function () {
var url = '/bpopstation/func/queryAll.do';
$http.post(url).success(function(res){
$scope.zNodes = res.respData;//赋值
var setting = {
view: {
dblClickExpand: false,
showLine: true,
selectedMulti: false
},
data: {
key: {
name: "funcName",//设置树显示的字段与接口里的字段对应关系
tId: "id",
children: "subFuncsList",//子节点名称与接口字段对应关系,梯形数据结构需要
},
simpleData: {
enable:false,//禁用简单的json数据结构,即用梯形结构
idKey: "funcCode",//设置id与接口字段对应关系(可以根据id找到当前节点)
pIdKey: "parentCode",//设置子pid与接口字段对应关系(可以根据pid找到父节点)
rootPId: ''
}
},
            check:{
              enable:true,//开启树的checkbox,也可以设置为radio
            },
callback: {
onClick: zTreeOnCheck //点击节点时 回调
}
};
var zTree = $.fn.zTree.init($("#functionLimitList"),setting,$scope.zNodes);//初始化
var functionLimitList = $.fn.zTree.getZTreeObj("functionLimitList");
functionLimitList.expandAll(true);//默认展开所有
          functionLimitList.setting.check.chkboxType = { "Y" : "ps", "N" : "ps" };//checkbox 选中/取消选中的时候关联到父子节点 p-父 s-子
            }).error(function(){});

        };
$scope.initZtreeData();
function zTreeOnCheck(){
$scope.getNodeDetail();
}; //点击节点时执行的回调
$scope.getNodeDetail = function () {
var treeObj = $.fn.zTree.getZTreeObj("functionLimitList");
var node = treeObj.getSelectedNodes();//点击节点后 获取节点数据
$scope.id = node[0].id; };
 

默认选中节点:(备注:默认选中的方法应该在树成功以后调用 才能保证每次check成功)

        $scope.roleZtreeDafultNodes = function () {
var url = '/';//接口名
var params = {
// 参数
};
$http.post(url,params).success(function(res){
var list = [,];//res.data里 获取到的节点id
for(var i=;i<list.length;i++){
var node = zTree.getNodeByParam("id",list[i]);
zTree.checkNode(node);
zTree.expandNode(node, true, true,true);
zTree.selectNode(node);
};
}).error(function(){}); };
$scope.roleZtreeDafultNodes();