如何连接文本绑定中使用的可观察值的值？

Question

填充用户数据后，我想将他们的全名显示为列表元素。

数据绑定设置如下：

<ul id="availableOwners">
    <!-- ko foreach: OwnersList-->
    <li data-bind="text: FirstName, click: AddOwnerToUser.bind($data), value: Id" style="cursor: pointer"></li>
    <!-- /ko -->
</ul>

我想用javascript函数显示全名:

<li data-bind="text: function() { return FirstName + ' ' + LastName }, click: AddOwnerToUser.bind($data), value: Id" style="cursor: pointer"></li>

但是，它按字面意思显示函数定义的列表，如下所示：

function () { return FirstName + ' ' + LastName}
function () { return FirstName + ' ' + LastName}
function () { return FirstName + ' ' + LastName}
...

有谁知道以这种方式绑定列表时如何正确显示全名？

Answer 1

要将多个 observables 连接在一起，您需要使用 ().

来评估它们

例如：

<li data-bind="text: FirstName() + ' ' + LastName(), click:AddOwnerToUser.bind($data), value: Id" style="cursor:pointer"></li>

但是，理想情况下，您应该使用 computed observable：

self.FullName = ko.computed(function () {
    return self.Firstname() + ' ' + self.LastName();
}

<li data-bind="text: FullName, click:AddOwnerToUser.bind($data), value: Id" style="cursor:pointer"></li>

Answer 2

对于更复杂的模型，与其过度填充 view/html 文件，您可以考虑使用计算的可观测值：

this.FullName = ko.computed(function () {
    return this.Firstname() + ' ' + this.LastName();
}

如何连接文本绑定中使用的可观察值的值？

How to concatenate values of observables used in a text binding?

javascript

knockout.js