如何添加到淘汰赛可观察数组的嵌套子项答案

【问题标题】：How to add to nested children of knockout observable array如何添加到淘汰赛可观察数组的嵌套子项
【发布时间】：2013-09-11 08:21:10
【问题描述】：

我有一些代码可以添加到敲除 observable 数组中，我正在将 observable 数组转换为对象，取消移动新对象，然后将该对象映射回视图模型。这可行，但似乎很慢。大约需要 2-5 秒或更长时间。

function addContact(office) { // Passing in object array of agency. We no it contains correct office and agency ID

        // Assign observable data to new variable then remove old
        // variable from mapping
        var objAgency = ko.toJS(agency);

        vm.agency.removeAll();


        // Fill new object with empty strings and related data
        var objContact = {
            agencyID: office.agencyID._latestValue,
            emailAddress: "",
            firstName: "",
            jobName: "",
            office: "",
            OfficeID: office.officeID._latestValue,
            personID: "",
            surName: "",
            title: ""
        }



        // unshift where office ID match
        for (i in objAgency[0].offices) {
                if (!isNaN(i)) {
                    if (objAgency[0].offices[i].officeID === objContact.OfficeID) {
                        objAgency[0].offices[i].contacts.unshift(objContact); // At i remove one object
                    }
                else {

                }
            } 
        }
        vm.agency([ko.mapping.fromJS(objAgency[0])]);
    }

我尝试添加到我的 observable 而不是执行转换过程，但我收到了这个错误：

Unhandled exception at line 9423, column 13 in http://localhost:13762/scripts/breeze.debug.js

0x800a01b6 - JavaScript runtime error: Object doesn't support property or method 'getProperty'

这是导致错误的代码

for (i in agency._latestValue[0].offices._latestValue) {
            if (!isNaN(i)) {
                if (agency._latestValue[0].offices._latestValue[i].officeID = objContact.OfficeID) {
                    agency._latestValue[0].offices._latestValue[i].contacts._latestValue.unshift([ko.mapping.fromJS(objContact)]);
                }
            }
        }

查看我的屏幕截图，了解代理机构的外观：

添加到这个可观察数组的正确方法是什么？据我了解，最新值是一种跟踪变化的机制，所以我不应该篡改它？

【问题讨论】：

标签： javascript knockout.js ko.observablearray

【解决方案1】：

如果我没记错的话，._latestValue 是您引用 knockout-{version}.debug.js 文件时的属性。如果你使用 knockout-{version}.js，那将不存在。无论如何，myObservable._latestValue === myObservable() === ko.unwrap(myObservable)。您不想引用_latestValue，因为当您在生产中使用缩小的淘汰赛js 文件时，此代码会中断。您应该将代码重写为：

for (i in agency().offices()) {
    if (!isNaN(i)) {
        if (agency().offices()[i].officeID = objContact.OfficeID) {
            agency().offices()[i].contacts().unshift([ko.mapping.fromJS(objContact)]);
        }
    }
}

这仍然不对，因为您的if 比较不是比较，而是分配。使用===:if (agency().offices()[i].officeID === objContact.OfficeID)

可能会这样做，但我对此表示怀疑，因为我怀疑 agency().offices()[i].officID 也是可观察的，在这种情况下，您需要使用 () 来访问其基础值。

另一个问题是你将一个数组转换成一个数组，有点像这样：

var arr = ["A", "B"];
arr.unshift(["Z"]);
// Result: [["Z"], "A", "B"];

因此，请去掉 .unshift 函数中的括号，除非您打算将数组添加到数组中。有些人喜欢哟 dawg。

虽然您可以调用 offices().unshift(value); 并操作底层数组，但最好像这样直接在 observableArray 上调用 unshift：offices.unshift(value);，因为 KO 会通知订阅者并更新 DOM。否则，您必须通知 KO 该值已发生变异。看看这个fiddle的区别。

希望这将有助于解决您的问题。

【讨论】：