0

私のアプリケーションでは、新しいネストされたオブジェクトを監視可能な配列に追加するためのイベントがあります。私のコードでは、これをやろうとしています:

  1. 監視可能な配列を標準の JS オブジェクトに変更します。これを objAgency と呼びましょう。
  2. プロパティを持つ新しいオブジェクトを作成します。これを objContact と呼びます。
  3. コード内にある ID を使用して、objAgency からの古いデータをつなぎ合わせます。
  4. その場所に objContact を追加します。
  5. objAgency をオブザーバブルに戻します。

  6. objAgency をバインディングにマップしましたが、次のエラーが表示されます。

    Unhandled exception at line 1936, column 17 in http://localhost:13762/scripts/knockout-2.2.1.debug.js

0x800a139e - JavaScript runtime error: Unable to parse bindings.

Message: ReferenceError: 'router' is undefined;

Bindings value: css: { active: router.isNavigating }

これは私の Agency.js ファイルです

define(['services/datacontext'], function (dataContext) {
    var initialized = false;
    var agency;

    agency = ko.observableArray([]);
    brands = ko.observableArray([]);

    var vm = { // This is my view model, my functions are bound to it. 
        //These are wired up to my agency view
        activate: activate,
        agency: agency,
        brands: brands,
        title: 'agency',
        refresh: refresh, // call refresh function which calls get Agencies
        save: save,
        cacheForm: cacheForm,
        addOffice: addOffice,
        addBrand : addBrand,
        removeBrand: removeBrand,
        addContact: addContact,
        removeContact: removeContact
    };
    return vm;

    function activate() {
        vm.agency;
        if (initialized) {
            return;
        }
        initialized = false;
        refresh();
    }

    function refresh() {
        dataContext.getAgency(agency);
        dataContext.getBrands(brands);
    }

    function addBrand() {
        brands.unshift({
            brandName : ""
        });

        // Change td css to editable textbox
        jQuery("#tblBrand td:first input").removeAttr('readonly');
    }

    function removeBrand(brand) {
        brands.remove(brand);
    }

これは、コードが壊れる addContact 関数です

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

        // Convert agency to object
        objAgency = ko.toJS(agency);

        // Get ID of office I am changing
        var officeID = office.officeID._latestValue;

        // Convert from observable to vanilla object
        objOffice = ko.toJS(office);

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

        // Unshift new object to front of object. It will be first row in table.
        objOffice.contacts.unshift(contact);

        // Convert back into observable
        //obsOffice = ko.observableArray([ko.mapping.fromJS(objOffice)]);

        // Splice where office ID match
        for (i in objAgency[0].offices) {
                if (!isNaN(i)) {
                    if (objAgency[0].offices[i].officeID === officeID) {
                        objAgency[0].offices.splice(i, 1); // At i remove one object
                    }
                else {

                }
            } 
        }

        objAgency[0].offices.unshift(objOffice);

        agency = ko.observableArray([ko.mapping.fromJS(objAgency[0])]);

        vm.agency = agency;
        ko.applyBindings(objAgency);

    }

    function removeContact(contact) {
        for (i in agency._latestValue[0].offices._latestValue) {
            if (isNaN(i)) { // Escape if NaN, otherwise use index valI ha

            }
            else {
                for (ii in agency._latestValue[0].offices._latestValue[i].contacts._latestValue) {
                    agency._latestValue[0].offices._latestValue[i].contacts.remove(contact);
                }
            }
        }
    }          
});

ko.applyBindings(objAgency); の理由がわかりません。ネストされたオブジェクトを 1 つ削除し、その場所に新しいオブジェクトを追加する以外はオブジェクトが変更されていないため、機能しません。

4

1 に答える 1

1

問題のあるコードを実行する前に、Durandal のコンポジション ライフサイクルはUI にバインドし、shell.js続いて ViewModelをバインドします。agency.js

一方、addContact関数の最後の行では、ビューに適用されるバインディング全体を基本的に変更します。

ko.applyBindings(objAgency);

したがって、UI全体がこれにバインドさobjAgencyれ、エラーが指しているため、ルーターインスタンスが含まれていないと思います:

 ReferenceError: 'router' is undefined;

shellこのエラーは、コードが新しいバインディングを適用したため、UI にバインドされなくなったため、おそらく のバインディングから発生します。

解決：

はapplyBindingsデュランダルによって構成プロセスで管理されます。ViewModel の一部のプロパティを変更する場合、バインディングを更新する必要はありません。

あなたが提供したコードがあなたのソリューションで機能しているかどうかはわかりませんapplyBindingsが、確かにそこにあるはずはありません。

データを置き換えるには:

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

または：

vm.agency.removeAll()
vm.agency.push(ko.mapping.fromJS(objAgency[0]));
于 2013-09-10T14:34:54.360 に答える