Выбит вложенным редактором на 3 и более уровней в глубину

При попытке расширить живой пример для вложенного редактора, представленного на сайте KO ( http://jsfiddle.net/rniemeyer/gZC5k/ ), чтобы изменить макет и добавить более глубокие уровни, я не смог решить две проблемы.

хотя я смог добраться до этого этапа http://jsfiddle.net/gZC5k/955/

Я застрял где-то в построении правильной иерархии в модели,

    var ContactsModel = function (contacts) {
var self = this;
self.contacts = ko.observableArray(ko.utils.arrayMap(contacts, function (contact) {
    return {
        firstName: contact.firstName,
        lastName: contact.lastName,
        phones: ko.observableArray(contact.phones),
        addresses: ko.observableArray(contact.addresses)
    };
}));

Две проблемы:

  • невозможность добавить новый «Вызов» в «Телефон», загруженный в исходный набор данных (когда я создаю новый телефон, я могу добавить «Вызовы»)
  • не могу удалить "Вызовы".

    self.removeCall = function (call) {
    $.each(self.phones(), function () {
        this.calls.remove(call)
    })
    

    };

Любая помощь приветствуется.


person Graphileon    schedule 24.02.2013    source источник


Ответы (2)


Я исправил вашу модель. Замените этот код в скрипте, а затем проверьте

Все работает идеально

self.contacts = ko.observableArray(ko.utils.arrayMap(contacts, function (contact) {
    return {
        firstName: contact.firstName,
        lastName: contact.lastName,
        addresses: ko.observableArray(contact.addresses),
        phones: ko.observableArray(ko.utils.arrayMap(contact.phones, function (phone) {
            return{
                type: phone.type,
                number: phone.number,
                calls: ko.observableArray(phone.calls)
            };
        }))
    };
}));
person NaveenKumar1410    schedule 25.02.2013
comment
Спасибо, босс ! Пропустил это полностью. дальнейшая оптимизация путем передачи функций удаления в html, так что нет необходимости зацикливаться на обходе всего дерева объектов. Думаю, это будет быстрее при наличии большого количества данных. - person Graphileon; 25.02.2013

Поскольку функция remove() ожидает наблюдаемый массив, делайте вызовы как observableArray

затем измените метод removeCall, как показано ниже.

self.removeCall = function (call) {
      alert(ko.toJSON(call));
     $.each(self.contacts(), function () {
        $.each(this.phones(), function () {
            alert(ko.toJSON(this));
        this.calls.remove(call)
    })
    })
}; 

Для метода addCall используйте ту же структуру, что и removeCall.

person NaveenKumar1410    schedule 25.02.2013
comment
Спасибо, босс. Все еще борюсь с вызовами наблюдаемого массива (пробовал это: jsfiddle.net/gZC5k/977) , но безуспешно. Так что ваше правильное решение (насколько я вижу) все еще не дает того эффекта, на который я надеялся. Всегда пытается снять звонок с первого номера). Но, как я уже сказал, ошибка в модели, а не в вашем решении. - person Graphileon; 25.02.2013
comment
Я исправил синтаксическую ошибку в вашей модели представления, добавленную как еще один ответ. Проверьте это. - person NaveenKumar1410; 25.02.2013