I have a child router setup for one of my viewModels using durandal. However, I can't read router's activeModule when the router is navigating to the second child route unless I also compose a view corresponding to the child route. Can anyone explain what is happening here?
Below is my code:
Parent View Model:
define(['plugins/router', 'durandal/app', 'knockout'], function (router, app, ko) {
var childRouter = router.createChildRouter().makeRelative({ moduleId: 'viewmodels/mytest', fromParent: true }).map([
{ route: 'first', title: 'First', moduleId: 'first', nav: true },
{ route: 'second', title: 'Second', moduleId: 'second', nav: true }
]).buildNavigationModel();
return {
router: childRouter,
displayName: 'mytest',
activeModule: ko.computed(function () {
if (childRouter.activeItem()) {
return childRouter.activeItem().__moduleId__;
}
}),
activate: function () {
// Activation code goes here
},
canReuseForRoute: function () {
return false;
}
};
});
Parent View:
<section>
<h2 data-bind="html: displayName"></h2>
<ul data-bind="foreach: router.navigationModel">
<li>
<a data-bind="attr: { href: hash }, html: title"></a>
</li>
</ul>
<!--<div data-bind="router: { transition:'entrance', cacheViews:true }"></div>-->
<div data-bind="html: activeModule"></div>
</section>
The child view models and views are pretty boring. However, if I uncomment the commented line above, then I am seeing the expected results in the next div. Otherwise I just always see the first module only regardless of whether I clicked on first or second.