Durandal Subrouting (Hottowel)

В основном, я пытаюсь создать меню внутри меню. Таким образом, в главном меню маршрута появится вертикальное меню с другим набором маршрутов. При нажатии на маршруты подменю обновляется только часть страницы, а вертикальное меню не перезагружается. Я предполагаю, что это будет похоже на этот скрипт KO http://jsfiddle.net/dPCjM/, но в главном виде маршрута потребуется другой набор директив KO "призрак":

 <!--ko compose: {model: router.activeItem, 
            afterCompose: router.afterCompose, 
            transition: 'entrance'} -->
 <!--/ko-->

и некоторые другие конфигурации на durandal router...

EDIT: И чтобы уточнить, я не пытаюсь создать раскрывающийся список в одном из основных пунктов меню. Я пытаюсь создать меню внутри одного из представлений. В основном, дюрандальное приложение внутри дюрандального приложения:)

?? фреймы:))))))))))

Ответ 1

ИЗМЕНИТЬ

Как и в Durandal.js 2.0, Маршрутизатор pluggin теперь имеет встроенные дочерние маршрутизаторы, который позволяет отключать выделение из коробки.

/Edit

Ниже представлен ответ на durandal 1.2

Плагин durandal router является оберткой вокруг sammyjs.

Плагин маршрутизатора позволяет управлять стеком истории браузера, а также дает вашему спа-центру возможность связываться с страницами со спа-салоном.

Его довольно легко заставить его сделать ссылку на 1 уровень глубиной, где у вас есть 1 главное меню и страницы, которые меняются и выходят. Но что, если вы хотите иметь подменю в главном меню и обеспечить глубокую ссылку.

Когда маршрутизатор поставлен в очередь для просмотра свопинга, активатор viewmodel сначала проверяет, является ли запрос для той же страницы в вашей модели просмотра. Если это тот же вид, вы можете отменить маршрут до его появления. Отменяя маршрут, когда он вызывает ту же страницу, вы можете использовать параметры маршрута и самостоятельно обрабатывать подпрограмму.

Метод, который проверяет, является ли его вызов той же самой страницей в модели view, называемой areSameItem. Вы можете переопределить этот метод внутри своей основной модели, вызвав:

return App = {
  router: router,
  subPage: ko.observable('defaultSubPage'),
  activate: function () {
     router.activeItem.settings.areSameItem = function (currentItem, newItem, data) {
        if (currentItem != newItem) { return false; }
        else { App.subPage(convertSplatToModuleId(data.splat)); return true; }
     }
  }
}

Конечно, это внутри модуля amd, а router - плагин durandal router. convertSplatToModuleId - это функция, которая принимает свойство splat, которое является значением маршрута, и преобразует его в модуль вспомогательной страницы, которую вы хотите показать.

Итак, эта часть была простой, но есть еще одна вещь, которая должна быть выполнена.

<div data-bind="compose: { model: subPage, afterCompose: router.afterCompose }"></div>

Ваша привязка для контейнера подстраниц должна вызвать router.afterCompose, потому что это то, что сообщает маршрутизатору, что маршрут был завершен, и его готовность обрабатывать новые маршруты.

Это непростая задача для объяснения. Итак, я создал пример и нажал сюда github.

Ответ 2

Так же, как голова к заинтересованным, предстоящий выпуск Durandal js 2.0 испек в функциях для глубокой привязки, что значительно упрощает работу над вашей собственной глубокой связью, основанной на превосходном примере Эвана.

Просмотрите образец нокаута, чтобы увидеть его в действии, который вы можете захватить из последних двоичных файлов с помощью Проект Durandal js github.

Следует отметить, что это существенный отход от предыдущей версии Durandal, поэтому вам придется внести некоторые изменения в исходный шаблон HotTowel, чтобы поддерживать его, поскольку есть многочисленные нарушения.