Javascript 与可观察数组的绑定内联

我有一个模型属性，定义如下：

function Field(name, size, type){
    this.name = ko.observable(name);
    this.size = ko.observable(size);
    this.type = ko.observable(type);
    this.map = ko.observable();
}

<ul data-bind="foreach: fields">
    <li class="form-inline">
        <span data-bind="text:name"></span> -> 
        <span data-bind="text: map.headerName"></span>
    </li>
</ul>

<ul data-bind="foreach: fields">
    <li class="form-inline">
        <span data-bind="text:name"></span> -> 
        <span data-bind="with: map"><span data-bind="headerName"></span></span>
    </li>
</ul>

我定义了一个可观察数组（

字段

），它是上述对象的数组。在ui交互中，字段对象的

map

属性将与另一个对象关联。它是一个

标题

对象，具有属性

标题名

和

索引

我正在尝试按如下方式绑定字段：

function Field(name, size, type){
    this.name = ko.observable(name);
    this.size = ko.observable(size);
    this.type = ko.observable(type);
    this.map = ko.observable();
}

<ul data-bind="foreach: fields">
    <li class="form-inline">
        <span data-bind="text:name"></span> -> 
        <span data-bind="text: map.headerName"></span>
    </li>
</ul>

<ul data-bind="foreach: fields">
    <li class="form-inline">
        <span data-bind="text:name"></span> -> 
        <span data-bind="with: map"><span data-bind="headerName"></span></span>
    </li>
</ul>

-> 

但没有成功：

按如下方式进行了尝试：

function Field(name, size, type){
    this.name = ko.observable(name);
    this.size = ko.observable(size);
    this.type = ko.observable(type);
    this.map = ko.observable();
}

<ul data-bind="foreach: fields">
    <li class="form-inline">
        <span data-bind="text:name"></span> -> 
        <span data-bind="text: map.headerName"></span>
    </li>
</ul>

<ul data-bind="foreach: fields">
    <li class="form-inline">
        <span data-bind="text:name"></span> -> 
        <span data-bind="with: map"><span data-bind="headerName"></span></span>
    </li>
</ul>

-> 

---

还是不行

您无需将

与

绑定一起使用即可解决此问题

<span data-bind="text: map() && map().headerName"></span>

---

演示。

我想知道，当您提供这样的数据绑定时，为什么Knockout不会抛出异常。找到问题并修复丢失的“文本：”会容易得多