Durandal.js: cambiar opciones de navegación por área

Quiero tener una navegación diferente por "área" de mi aplicación durandal. Logré esto con ASP.NET MVC al usar Áreas al definir una sección de navegación en la página de diseño y tener páginas de diseño anidadas que implementan la navegación para cada área. La estructura de la vista en Durandal es la siguiente:

http://i1346.photobucket.com/albums/p697/user2269352/viewstructure_zps5e21e724.gif

Estoy usando la plantilla durandal ASP.NET MVC4 y supongo que podría necesitar cambiar el siguiente segmento de shell.html

<ul class="nav" data-bind="foreach: router.visibleRoutes">
    <li data-bind="css: { active: isActive }">
        <a data-bind="attr: { href: hash }, html: name"></a>
    </li>
</ul>

Supongo que idealmente me gustaría tener páginas html separadas que pudieran cargarse en esta sección dependiendo del área/página que esté viendo.

preguntado el 16 de abril de 13 a las 08:04

2 Respuestas

Puede lograr esto agregando un objeto de configuración a su información de ruta y especificando el nombre del área allí. Con eso en su lugar, cree un observable computado contra la colección visibleRoutes del enrutador que seleccione solo las rutas para el área actual.

No estoy seguro de cómo se ve la configuración de su ruta, pero un ejemplo de cómo agregar configuraciones sería algo como esto:

var routes = [
    { url: 'one/page1', moduleId: 'viewmodels/one/page1', name: 'Page 1', visible: true, settings: {area: 'one'} },
    { url: 'two/page1', moduleId: 'viewmodels/two/page1', name: 'Page 1', visible: true, settings: {area: 'two'} }
];
router.map(routes);

En su modelo de vista donde está controlando la navegación html:

//filter the visible routes for the current area
viewModel.areaRoutes = ko.computed(function () {
    var area = this.area;
    return ko.utils.arrayFilter(router.visibleRoutes(), function (route) {
        return route.settings.area === area;
    });
}, viewModel);

Respondido 17 Abr '13, 02:04

Bastante inteligente, Joseph... Tendré que probarlo. - mikekidder

Creo que también hay algún soporte explícito para las áreas en Durandal, pero es bueno conocer esta técnica. - José Gabriel

@JosephGabriel, ¿sabe dónde podemos encontrar información sobre el apoyo de Durandal para las áreas? Parece que no puedo encontrar ninguno en línea. - jonas stawski

La solución basada en Joseph Gabriel funciona para mí y jugar con router.activeItem.settings.areSameItem Puedo configurar el grupo de cada ruta en cualquier lugar de mi diseño.

router.activeItem.settings.areSameItem = function (currentItem, newItem, activationData) {
    return currentItem == newItem; //replace this with your own code
};

contestado el 01 de mayo de 13 a las 11:05

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.