knockout.js - KnockoutJS - 显示文本框中逗号分隔的 observableArray 的内容

Question

这应该是一个简单的问题:我的 View 模型中有一个名为“To”的 observableArray 对象，其中包含 EmailAddress 元素。每个元素都有两个属性:DisplayName 和 Address。

我想将数组中的每个元素打印到单个输入字段，以分号分隔。我现在得到的是:

“[对象对象]，[对象对象]”

如何绑定(bind)并打印属性？我尝试了各种解决方案，例如添加“value: to.DisplayName”，但无济于事。

<!-- illustration only, this is what the items in the TO array look like
     I want to print the value of DisplayName for each element -->
var EmailAddress = function(dName, addr) {
    self = this;
    self.DisplayName = dName;
    self.Address = addr;
};

<!-- viewmodel -->
var EmailModel = function (email) {
            var self = this;
            self.id = ko.observable();
            self.subject = ko.observable();
            self.body = ko.observable();
            self.from = ko.observable();
            self.to = ko.observableArray(); <-- display the DisplayName property of these elements)
            self.cc = ko.isObservable();
            self.bcc = ko.observable();
            };


<!-- print the contents of the TO array --> 
<input data-bind="value: to" type="text" />

Answer 1

编辑:第一次错过了错误，下次应该阅读整个问题。

在这种情况下有两种方法。使用计算的 obvservable，或内联 arrayMap。

这里是 a fiddle.