angularjs编写一颗3级目录的树结构
来源:互联网 发布:兄弟连it教育地址 编辑:程序博客网 时间:2024/05/22 03:28
一、需要引用的包(项目本地包)
<script language="JavaScript" src="resources/lib/jquery.min.js"></script>
<script src="angulartree/demo/angular.1.2.29.js"></script>
<script src="angulartree/demo/bootstrap.3.1.1.js"></script>
<script src="angulartree/demo/ui-bootstrap-tpls.0.11.2.js"></script>
<script src="angulartree/demo/prettify.1.0.1.js"></script>
<link href="angulartree/demo/bootstrap.3.1.1.css" rel="stylesheet" type="text/css">
<link href="angulartree/demo/prettify-style.css" rel="stylesheet" type="text/css">
<script src="angulartree/angular-tree-control.js"></script>
<link rel="stylesheet" type="text/css" href="angulartree/css/tree-control.css">
<link rel="stylesheet" type="text/css" href="angulartree/css/tree-control-attribute.css">
=、通过ajax从后台获取数据
var path= "<%=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;
for(var i=1;i<json.length;i++){
if(json[i].devType=="1"){
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 = [
{
id : "id1",
label : "杭州市",
links : [
{
id : "id1.1",
label : "基站设备 ("+hazsbaseJsonarray.length+") 台",
links : hazsbaseJsonarray
},
......其它类似...........
]
}, ......其它类似...........
];
//可以更改子节点的名称
$scope.opts = {
nodeChildren : "links"
};
//加载这棵树
var angulartree = angular.module(
"angulartree",
[ "treeControl"]);
- angularjs编写一颗3级目录的树结构
- 源代码目录结构--AngularJS学习笔记(一)
- angularJS源码目录结构和文件的解读
- Maven(一)约定的目录结构、常用命令
- AngularJS系列——目录结构
- OFBiz(一):目录结构
- 一、linux目录结构
- maven (一):目录结构
- Linux目录结构(一)
- 编写强angularJS的应用
- html编写代码的目录树
- Ubuntu系统目录结构---(一)
- linux 目录结构(一)
- android目录结构(一)
- 一、认识linux目录结构
- Linux文件系统目录结构的详细解说(一)
- sqlmap 的源码学习笔记一之目录结构
- sqlmap 的源码学习笔记一之目录结构
- 剑指Offer----面试题25:二叉树中和为某一值的路径
- Java的GC的内部原理
- 数据结构
- MYSQL中IFNULL的使用 以及统计2张表的字段和
- LaTeX新手上路
- angularjs编写一颗3级目录的树结构
- 大型网站架构系列:缓存在分布式系统中的应用(二)
- easyUI datagrid可编辑行JS代码片段总结
- 移动计算概念
- quartz单独使用,不整合spring实例
- chromium loadUrl流程
- LayoutInflater.inflate() 方法剖析
- Caffe技巧之使用snapshot来继续网络训练
- Linux上挂载新硬盘