javascript - KnockoutJS:嵌套的observableArrays和嵌套的ForEach

免责声明-我担心这个问题可能是重复的，因为功能似乎很基本，所以我知道我可能会被骗。但我找不到有效的解决方案

所以我有一个可观察的数组设置如下

self.meetingAttendees = ko.observableArray([
    {
        AttendeeTypeId: ko.observable(1),
        AttendeeNames: ko.observableArray([
            { Name: ko.observable("Nemo"), CurrentEdit: ko.observable(0) }
        ]),
        AttendeeSiteNumber: ko.observable(""),
        StudentNames: ko.observableArray([
            { Name: ko.observable("Flava Flave"), CurrentEdit: ko.observable(1) }
        ]),
        Email: ko.observable(""),
        Telephone: ko.observable("")
    }]);

而我的“问题” HTML是：

<tbody data-bind="foreach: $root.meetingAttendees">
    <tr>
        <td class="attendeeNameCol textAlignCenter">
            <div class="textAlignCenter" data-bind="foreach:{data: AttendeeNames, as: 'Attendee'}">
                 <input class="formInput" data-bind="textInput: Attendee.Name()"/>
                 <span class="glyphicon glyphicon-remove nameRemove" data-bind="click:$root.removeName.bind($data,$index(),'AttendeeNames',$parentContext.$index())"></span>
            </div>
            <span data-bind="visible:$root.meetingAttendees()[$index()].AttendeeTypeId() == 1,click:$root.addName.bind($data,$index(),'AttendeeNames',$index())" class="addAnotherText">(+) Add Another Parent</span>
         </td>
    </tr>
</tbody>

一切似乎都可以正常工作，并且使用伪数据可以正确绑定。但是，当我将元素推入AttendeeNames中时

self.meetingAttendees()[parentIndex].AttendeeNames().push( {Name: ko.observable(""),CurrentEdit: ko.observable(1)});

我的看法没有插入其他元素。我检查了数组，它确实表明已添加了一个元素，因此我认为这是一个绑定问题。

我的问题是如何正确绑定，以便嵌套的foreach语句正确更新并在嵌套的observableArrays中显示信息？

最佳答案

因此，AttendeeNames是一个可观察到的阵列。如果在console.log上进行操作，则会注意到您获得的是函数而不是数组。实际上可以以两种方式使用此变量。

如果将其称为AttendeeNames()，则将获得没有任何基因剔除功能的基础数组。因此，您可以随心所欲地修改此基础数组，然后将其打印出来，看起来好像数据在变化，但是视图不会更新，因为敲除无法得知这些变化。您可以使用AttendeeNames.valueHasMutated()手动将此更改通知可观察者。注意它是如何使用淘汰赛功能的-在()之后没有AttendeeNames。如果您认为自己可能要进行大量更改并且由于性能原因不想在所有操作都完成之前更新视图，则有时这可能很有用。

调用AttendeeNames.push()时，实际上是在使用敲除功能，该功能将项目添加到基础数组中，并通知视图需要更新。

概括：

以下代码片段具有相同的功能：

AttendeeNames.push(item);

AttendeeNames().push(item);
AttendeeNames.valueHasMutated();

通过使用()访问可观察到的基因敲除，您将绕过所有基因敲除的东西，并获取封装的Javascript值。

关于javascript - KnockoutJS:嵌套的observableArrays和嵌套的ForEach，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/33765424/