如何添加到knockout observable数组的嵌套子代

Question

我有一些代码可以添加到一个knockout可观察数组我将可观察数组转换为一个对象，取消一个新对象，然后将该对象映射回视图模型。这有效，但似乎很慢。大约需要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)]);
                }
            }
        }

请参阅我的截图，了解代理机构的样子：

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

Answer 1

如果我没有弄错的话，当您引用knockout- {version} .debug.js文件时，._latestValue是一个属性。如果您使用knockout- {version} .js，那将不会出现。无论如何，myObservable._latestValue === myObservable() === ko.unwrap(myObservable)。您不想引用_latestValue，因为当您在生产中使用缩小的knockout 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中的差异。

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