如何使用knockout在树模型中显示json数据？

Question

我有这样一个简单的json文件。

"Test": 
    [ 
     { 
      "id":"1", 
      "type" : "test1" 
     }, 
     { 
      "id":"1.1",  
      "type":"test2" 
     }, 
     { 
      "id":"1.1.1", 
      "type":"test3" 
     }, 
     { 
      "id":"1.1.2", 
      "type":"test3"     
     }] 

我想在树状模型中使用敲除来显示这些数据，如下所示。

 1 test1 
     1.1 test2 
     1.1.1 test3   
     1.1.2 test4 

我还没有看到我的要求的任何样品解决方案。任何人都可以指导我？谢谢。

Answer 1

如果你的数组排序正确，那么你可以使用style结合通过根据CSS规则申请左填充的项目元素：

<ul data-bind="foreach: test"> 
    <li data-bind="style: { paddingLeft: (id.length * 10) + 'px' }"> 
     <span data-bind="text: id"></span> 
     <span data-bind="text: type"></span> 
    </li> 
</ul> 

您可以检查它是如何工作在这里：http://jsfiddle.net/7vyfW/

这方法不会跟踪你的结构，所以如果你想创建一个可编辑列表是没有用的。但是如果你的任务只是显示一棵树，它就简单而有效。