angular-ivh-treeview是一个可以呈现树形结构的Angularjs第三方插件，最近一个项目中需要呈现一个目录的树形结构，就发现了这个插件，使用下来感觉功能还是蛮齐备的，所以在此记录下使用的一些心得。
GitHub地址: https://github.com/ivantage/angular-ivh-treeview
插件主页: http://ivantage.github.io/angular-ivh-treeview
其实Github上的使用说明已经很详尽，我在这里也不会重复的每个功能的使用都讲一遍，只是以一个使用的实例来说明如何使用它。
安装
在网站上下载Release版本后，解压缩完毕后，添加到项目的js相关的目录
文件目录
然后在页面内加入css和js的引用
在需要使用树形结构的页面中插入如下的标签
只要<div ivh-treeview="数据"></div>就可以显示树形结构了，其他属性后面会详细介绍
在需要使用树形结构的Controller中添加依赖
Ok，这样ivhtreeview基本就配置完毕了。
树形结构数据准备
前端的架子搭起来了，我们就需要在后端准备数据了。我们以生成一个Git的代码目录结构为例。我们需要遍历某个目录，最先想到的肯定是递归遍历，如下代码
我们先创建一个FileInfo的实体类，用于表示文件夹或文件
递归遍历目录
这样我们就得到了一个FileInfo类型的对象,它影射的Json格式大概就这个样子：
最后，只要把后台生成的数据返回给前端显示就可以了。
网友评论