gpt4 book ai didi

angularjs - 在 Angular 指令中包装 JSTree

转载 作者:行者123 更新时间:2023-12-01 01:06:21 27 4
gpt4 key购买 nike

我有两个加载相同 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/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com