Durandal 中路由器 isActive 和 router.isNavigating 之间的区别是什么

Question

http://durandaljs.com/documentation/Using-The-Router.html 说

Note that each navigable route in the model has an isActive flag which will be true when the associated route is active. The final thing to notice is that we have bound a simple spinner animation to the router.isNavigating.

首先，有人可以帮我澄清一下 isActive 和 isNavigating 之间的区别吗？

其次，isActive指的是下面的代码

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

我搜索了hostedhere的官方代码，没找到activeclass定义的地方。感谢您的帮助！

Answer 1

如果路由器当前正在从一条路由过渡到另一条路由，则

router.isNavigating 为真。

如果该路线当前开始显示，

isActive 将为真。

假设您的导航模型中有两条路线：

 var routes = [
                { route: '', moduleId: 'home', title: 'Home' },
                { route: 'subpage', moduleId: 'subpage', title: 'Sub Page' }
              ]

您开始查看回家路线，所以回家 isActive 为真。 router.isNavigating 是假的，因为你没有过渡。

然后你点击一个link带你到subpage

home isActive 现在为 false，子页面 isActive 为 true 并且 isNavigating 在 durandal 加载视图和视图模型并执行转换时变为 true。

加载完成后 isNavigating 变为 false。主页不活跃，子页面还在。

您找不到 .active class 因为它不在 durandal css 中。它在 bootstrap.css

Durandal 中路由器 isActive 和 router.isNavigating 之间的区别是什么

What's the diff between router isActive and router.isNavigating in Durandal

durandal