KnockoutJS:将数组绑定到具有多行行的引导网格

Question

我想采取这样的数组:

var items = [1,2,3,4,5,6]

并将其绑定在KnockoutJS中,以便呈现的输出为:

<div class="row">
 <div class="col-md-4">1</div>
 <div class="col-md-4">2</div>
 <div class="col-md-4">3</div>
</div>
<div class="row">
 <div class="col-md-4">4</div>
 <div class="col-md-4">5</div>
 <div class="col-md-4">6</div>
</div>

如果不需要每三个项目关闭并打开一个新行,这将是直截了当的.任何建议,将不胜感激!

谢谢...

-ben

Answer 1

假设items在应用程序运行时将更新:

var model = {};

model.items = ko.observable([1,2,3,4,5,6]);

model.renderedItems = ko.computed(function() {
  var data = model.items();
  var times = Math.ceil(items.length / 3);
  var result = [];
  for (var i = 0; i < times; i ++) {
    result.push(data.slice(i * 3, i * 3 + 3));
  }
  return result;
});

现在绑定renderedItems到将具有两个嵌套foreach绑定的模板.