在AngularJS中使用jQuery的zTree插件的方法_AngularJS

前段时间一直在看AngularJS的资料，感觉是个很好的框架，很想有机会尝试用它做点什么。
jQuery ZTree是国内非常不错的JQuery插件，功能齐全，文档和API也非常的友好，之前项目上常用此插件。
AngularJS 功能虽然非常强大，但UI上提供的插件不像JQuery那么多，而且只能通过directive定义扩展的UI插件，虽然国外已经提供了一些基于 directive的Tree功能实现，但毕竟不像ZTree那样强大，而且Tree是做项目中很长用的一个基本功能。
因此，花了一点时间做了一个例子将ZTree应用到AngularJS中。

zTree和后台数据的交互
首先，肯定是在页面中引入Angularjs的相关脚本，例如模块(e.g. app.js)、控制器(e.g. controller.js)、Angularjs的脚本并进行相关标记的使用，然后引入zTree的样式包和zTreed 脚本，可以参看一下代码：

 
 
  
  <meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"><title>树型菜单</title><link href="plugins/bootstrap-3.3.5/css/bootstrap.min.css" rel="stylesheet"><link href="css/zTreeStyle.css" rel="stylesheet"><div id="content" class="content clearfix" ng-controller="wtConfigInfo"> 
  <ul tree id="tree" style="font:normal 12px/35px 'Arial';color:#dcdcdc;" class="ztree" ng-model="selectNode" value="1"></ul>
</div> 
  
 
<script src="plugins/jquery-1.11.3.min.js" type="text/javascript"></script><script src="plugins/bootstrap-3.3.5/js/bootstrap.min.js" type="text/javascript"></script><script src="..//js/angular.min.js" type="text/javascript"></script><script src="..//js/angular/app.js" type="text/javascript"></script><script src="..//js/angular/controllers.js" type="text/javascript"></script><script src="../plugins/zTree/jquery.ztree.all-3.5.js" type="text/javascript"></script>