一、需要引用的包(项目本地包)
=、通过ajax从后台获取数据
var path= "";
var json;
$.ajax({
cache: false,
type: "get",
url:path+"/rs/res/tetra/equipmentDetail/detail",
async: false,
error: function(request) {
},
success: function(data) {
json=data;
}
});
三。对数据进行处理,转化成需要的json格式
var baseJson="[]";
var hazsbaseJsonarray = eval('('+baseJson+')');
var basearr;
var basearr;
for(var i=1;
i
if(json[i].cityId=="杭州市"){
basearr = {
"id" :json[i].provinceId,
"label" : json[i].devName,
"type" : "file"
};
hazsbaseJsonarray.push(basearr);
}
}else{}
}
四、在对应的angularjs树形框架上添加改写的参数
function Children($scope) {
$scope.treedata = https://www.it610.com/article/[
{
id : "id1",
label : "杭州市",
links : [
{
id : "id1.1",
label : "基站设备 ("+hazsbaseJsonarray.length+") 台",
links : hazsbaseJsonarray
},
......其它类似...........
]
},......其它类似...........
];
//可以更改子节点的名称
$scope.opts = {
nodeChildren : "links"
};
//加载这棵树
var angulartree = angular.module(
"angulartree",
[ "treeControl"]);
【前端|angularjs编写一颗3级目录的树结构】
推荐阅读
- web网页模板|如此优秀的JS轮播图,写完老师都沉默了
- 接口|axios接口报错-参数类型错误解决
- JavaScript|vue 基于axios封装request接口请求——request.js文件
- JavaScript|JavaScript — 初识数组、数组字面量和方法、forEach、数组的遍历
- JavaScript|JavaScript — call()和apply()、Date对象、Math、包装类、字符串的方法
- 前端|web前端dya07--ES6高级语法的转化&render&vue与webpack&export
- vue|Vue面试常用详细总结
- javascript|vue使用js-xlsx导出excel,可修改格子样式,例如背景颜色、字体大小、列宽等
- css|我用css精灵图拼接了自己的英文名字,不会还有人不知道精灵图技术吧()
- css|css三角的做法及其案例