Jquery Knockout для/цикла while внутри шаблона

Я хочу создать таблицу древовидной структуры.

У меня есть json-массив строк. Одна строка может иметь другие дочерние строки.

[
   {
      "Name": "Row 1",
      "Depth": 1,
      "Rows": [{ "Name": "Row 1.1", "Depth": 2, "Rows": [] }]
   },
   {
      "Name":" Row 2",
      "Depth": 1,
      "Rows": []
   }
]

Шаблон, который у меня есть для строки (который не работает), выглядит так:

<script type="text/html" id="row-template">
   <tr>
       {{ for(var i = 1; i<= Depth; i++) { }}
          <td class='col'></td>
       {{/for}}

       <td data-bind="text: Name"></td>
   </tr>
</script>

Есть ли способ использовать повторяющиеся операторы внутри шаблона нокаута, чтобы я мог добавить дополнительные n столбца, которые мне нужны для каждой строки?


javascript jquery knockout.js
person Catalin    schedule 17.04.2013    source источник
comment
Вы смотрели stackoverflow.com/questions/11509324/ Похоже на то, что вы хотите.   -  person Paul Manzotti    schedule 17.04.2013
comment
Это решает проблему вложенных шаблонов, но это не то, что мне нужно :(   -  person Catalin    schedule 17.04.2013

Ответы (1)


arrow_upward
2
arrow_downward

Я думаю, что с точки зрения MVVM вы переусердствуете с разметкой; Итак, мое предложение: почему вы не определяете вычисление, которое возвращает массив элементов из модели представления?

Например, ViewModel.

function MyViewModel() {
    var self = this;

    self.Depth= ko.observable(10);


   self.DepthRepeated= ko.computed(function(){
       var ret = [];
       for(var i =0; i<self.Depth(); i++)
        ret.push(i);//note: very dirty way to create/populate an array!..but it's just for PoC

       return ret;

   });
}

HTML:

<div data-bind="foreach: DepthRepeated"></div>

(конечно, в html-части я вставил div, вы вставите td/tr)

person Francesco Pez    schedule 17.04.2013