剑道UI角度网格 - 关闭全部头

Question

我基于以下结构的剑道格：

Master Group A 
     Sub Group A 
      -Data A- 
      -Data B- 
     Sub Group B 
      -Data C- 
      -Data D- 
     Sub Group C 
      -Data E- 
      -Data F- 
    Master Group B 
     Sub Group A 
      -Data G- 
      -Data H- 
     Sub Group B 
      -Data I- 
      -Data J- 
     Sub Group C 
      -Data K- 
      -Data L- 
    Master Group C 
     Sub Group A 
      -Data M- 
      -Data N- 
     Sub Group B 
      -Data O- 
      -Data P- 
     Sub Group C 
      -Data Q- 
      -Data R- 

我想它看起来以下时，第一次加载页面像：

Master Group A 
     Sub Group A 
     Sub Group B 
     Sub Group C 
    Master Group B 
     Sub Group A 
     Sub Group B 
     Sub Group C 
    Master Group C 
     Sub Group A 
     Sub Group B 
     Sub Group C 

我的数据当前是每行一个数据部件。每行数据都是它自己的数据。 有谁知道如何做到这一点？

• 我有剑道Angular2松弛：https://kendouiangular2.slack.com

Answer 1

有剑道电网没有简单的解决方案，为angular2这样做。

我能想到的方法2：

1）数据

的过滤阵列你可以有2个阵列的数据：一个参考/只读阵列与所有组，子组和数据，并且经滤波的阵列专用于显示，当您点击子组行中的按钮时，在每个子组中添加/删除数据。

然后，将网格数据绑定到已过滤的数组，并在子组按钮上的事件上修改已过滤的数组。

2）CSS-仅

数据的单一阵列，然后应用类剑道电网的<tr>标签来显示/隐藏基于您的子组按钮事件数据线。 如果您有jQuery的你的项目，你可以用类似的东西相对容易地访问这些TR标签：

$('.some-class-i-add-to-all-my-data-lines').parents('.k-master-row') 

如果你没有的jQuery这是一个有点那么简单。