Цикл Foreach для привязки ключ / значение ObservableArray
Я пытаюсь создать меню на основе наблюдаемого массива, заполненного пунктами меню. У меня также есть div, которые должны быть видны при нажатии на элемент меню, проблема в том, что у этих div были видимые привязки, основанные на позиции массива их указанного пункта меню. Это работало до тех пор, пока я не попытался удалить / добавить какой-либо пункт меню в массив, и я понял, что это ужасный способ привязки пунктов меню к элементам div.
В качестве решения я решил использовать наблюдаемый массив ключ / значение, чтобы не было никакого значения, был ли элемент меню добавлен или удален. Я получил это, чтобы работать для отдельных пунктов меню с привязками, но я не могу заставить его работать с циклом foreach (чтобы показать набор элементов меню).
Вот скрипка:http://jsfiddle.net/Dennis50/uu2u90my/
Например, я бы заставить это работать:
<h2 data-bind="text: $root.parentArray()[0].project.childObservableArray()[0].klimaat.destUrl()"></h2>
Но когда я пытаюсь заставить его работать для нескольких пунктов меню, я не могу заставить это работать:
<div data-bind="foreach: $root.parentArray()[0].project.childObservableArray()[0]">
<h2 data-bind="text: destUrl()"></h2>
</div>
Итак, как мне связать эти пункты меню, используя цикл foreach, и является ли это даже лучшим решением этой проблемы?