在树视图角复选框 [英] Angular checkboxes in tree view

查看:131
本文介绍了在树视图角复选框的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我无法找到一个很好的适合指令创建从一个JSON结构复选框树视图,所以我这样做了一个自我调用迭代器,因为在这里看到:

I could not find a really good suitable directive for creating a tree view with checkboxes from a JSON-structure, so I did this with a self-calling iterator, as seen here:

http://jsfiddle.net/u2ho9d3j/

现在,我已经得到了唯一的问题是,(看'牛仔'数据线40,有这样的:

Now, the only problem I've got, is that (look at the 'Jeans' data in line 40, there's this:

"chk": true,

这确实当然标志着牛仔裤-checkbox,而不是上面。这些值将来自数据库的正确的(其中甚至以上bransch将有CHK =真实的,但没有少,我在一个如何触发初始泡沫起来,为选中标记所有家长如果一个项目被标记好奇作为真。

This does of course mark the "Jeans"-checkbox, but not the above. These values would come correct from the database (where even the above bransch would have chk = true, but none the less I am curious on how one could trigger the initial "bubble up and mark all the parents as checked" if an item is marked as "true".

有人能帮助我了解如何可以做?

Could someone help me out to understand how that could be done?

非常感谢!

克里斯托夫

推荐答案

我想preprocess在递归的方式树数据类似于您使用setData功能:

I would preprocess the tree data in a recursive way similar to your setData function:

 function initTree(tree) {
   function processNode(node) {
     angular.forEach(node.children, function(child) {
       if(processNode(child) === true) {
         node.chk = true;   
       }
     });

     return node.chk;
   }

   angular.forEach(tree, processNode);
 };
 initTree($scope.tree);

请参阅更新小提琴 http://jsfiddle.net/65yucqge/

修改
这里是展示如何获取复选框数据到一个数组另一个小提琴:
http://jsfiddle.net/tmakin/kmhw1ue0/

这篇关于在树视图角复选框的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆