我有两个加载相同 jstree 的 fiddle 。一个包含在 Angular 指令中，另一个没有。我是 Angular 的新手。我没有看到任何 Angular 版本的图像。动画也不起作用。我是否缺少 jstree 插件，还是需要添加一个绑定(bind)函数来添加此功能？
这是 fiddle :(不在 Angular js中)
这是简单的 js 树代码:
$('#tree').jstree({
'plugins' : ['themes', 'json_data', 'checkbox', 'types'],
'icon':false,
'checkbox' : {
'two_state' : true // Nessesary to disable default checking childrens
},
"json_data" : {
"data" : [
{
"data" : "Basics",
"state" : "open",
"children" : [{
"data" : "login",
"state" : "closed",
"children" : [ "login", {"data" : "results", "state" : "open"} ]
},
{
"data" : "Basics",
"state" : "closed",
"children" : [ "login", "something",{"data" : "results", "state" : "closed"} ]
}
]
},
{
"data" : "All",
"state" : "closed",
"children" : [ {
"data" : "AddCustomer",
"state" : "closed",
"children" : [ "login","Add", {"data" : "results", "state" : "closed"} ]
} ]
}
]
},
"types" : {
"types": {
"disabled" : { // Defining new type 'disabled'
"check_node" : false,
"uncheck_node" : false
},
"default" : { // Override default functionality
"check_node" : function (node) {
$(node).children('ul').children('li').children('a').children('.jstree-checkbox').click();
return true;
},
"uncheck_node" : function (node) {
$(node).children('ul').children('li').children('a').children('.jstree-checkbox').click();
return true;
}
}
}
}
});
http://jsfiddle.net/R3vZv/
这是一个带有 angular 指令的 plunker:
http://plnkr.co/edit/xHIc4J
最佳答案
好吧，在你的 plunker 上，你在 jstree 样式表上得到了 404，把这个 HTML 放在你的 plunker 和 viola 中!我正在引用作者网站上的 CSS。我建议你把它拉下来，把正确的 CSS 路径放在那里
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jsTreeAngular</title>
<link rel="stylesheet" href="http://hqnetworks.pl/strassmayr_zpf/web/js/themes/default/style.css" />
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.0.3/jquery.min.js" ></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.1.5/angular.min.js"></script>
<script type="text/javascript" src="jquery.jstree.js" ></script>
<script type="text/javascript" src="app.js" ></script>
</head>
<body>
<div ng-controller="TestCtrl" ng-app="jsTreeApp">
</br>
</br>
</br>
<jstree data="5"></jstree>
</div>
</body>
</html>
你怎么敢责怪Angular!开玩笑:)
关于angularjs - 在 Angular 指令中包装 JSTree，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/18498619/