javascript - knockout 数据绑定(bind)字符串串联数组

Question

如何在 Knockout 中对串联的字符串数组进行数据绑定(bind)？我想做这样的事情:

<span data-bind='text: foreach person in persons person.name+","+person.age>

显然语法是错误的，但是是否可以在不为每个人创建多个跨度的情况下执行类似上述的操作？

Answer 1

您可以在数据绑定(bind)中使用任何类型的有效 JavaScript。所以认为可以做这样的事情:

选项 1 - See fiddle

假设这样的模型:

var model = {
  people : ko.observableArray([
    {name: "Name1", age: 30},
    {name: "Name2", age: 31},
    {name: "Name3", age: 32},
  ])
}

ko.applyBindings(model);

我们可以做到:

<span data-bind='text: people().map(function(p){return p.name + "," + p.age}).join(", ")'> </span>

选项 2 - See fiddle

但是嵌入 coplex 内联 javascript 并不是一个好的做法，我建议创建一个像这样的计算属性

var model = {
  people : ko.observableArray([
    {name: "Name1", age: 30},
    {name: "Name2", age: 31},
    {name: "Name3", age: 32},
  ]),
}

model.allPeople = ko.computed(function() {
    return model.people().map(function(p){return p.name + "," + p.age}).join(", ");
});

ko.applyBindings(model);

和 HTML:

<span data-bind='text: allPeople'> </span>