Раскрывающийся список Knockoutjs Cascading с использованием плагина Mapping: неопределенная ошибка ссылки

Я пытаюсь создать каскадное раскрывающееся меню на основе примера корзины Knockout.js, но с сопоставлением плагин для получения моих данных.

У меня плагин сопоставления работает нормально, шаблон работает нормально, первый выбор хороший, но на втором получаю ошибку.

Ошибка:

Uncaught Error: Unable to parse bindings.

Сообщение: ReferenceError: PayCodes не определен; Значение привязки: options:PayCodes, optionsValue:'Value', optionsText:'Text', значение: $parent.PayCodeId

Изменение строки:

<select data-bind="options:PayCodes, optionsValue:'Value', optionsText:'Text', value: $parent.PayCodeId" class='type'></select>

to: (добавлено ключевое слово this)

<select data-bind="options:this.PayCodes, optionsValue:'Value', optionsText:'Text', value: $parent.PayCodeId" class='type'></select>

исправляет ошибку, но второй выбор все еще не работает. Он никогда не получает никаких вариантов. Массив PayCodes существует, как видно из прикрепленных данных JSON.

Вот скрипт, дублирующий проблему: http://jsfiddle.net/JLhSx/13/

Отформатированный JSON находится здесь на случай, если это поможет.

Какие-либо предложения?

ИЗМЕНИТЬ в оригинал:

Добавление

Внутри моего раздела «with:» просто возвращается идентификатор моего PayTypeId, поэтому раздел «with:» не получает полный наблюдаемый массив PayTypes, как я ожидал. Как я могу реорганизовать это так, чтобы в первом раскрывающемся списке отображался список PayTypes, а во втором отображались PayCodes выбранного PayType?

Обновлена ​​скрипта.

Спасибо!


person Andrew Grothe    schedule 19.06.2012    source источник


Ответы (1)


Хорошо, у меня все работает. Пожалуйста, дайте мне знать, если есть лучший способ.

Обновленная скрипта здесь

Я использовал foreach с вложенным if. Это кажется немного хакерским или излишним. Сейчас я просто счастлив, что это работает!

<td>
    <select data-bind='options:PayTypes, optionsValue:"Id",optionsText:"PayType", value: PayTypeId ' class='type'></select>
</td>
<td data-bind="foreach: PayTypes">
    <!-- ko if: (Id() == $parent.PayTypeId())  -->
       <select data-bind="options:PayCodes, optionsValue:'Value', optionsText:'Text', value:$parent.PayCodeId" class='type'></select>
    <!-- /ko -->
</td>

Лучшие версии без цикла приветствуются и обязательно будут отмечены как ответ.

person Andrew Grothe    schedule 20.06.2012