第一次在Aurelia之后路由到页面时,Loader不会出现

时间:2017-08-10 07:03:08

标签: aurelia

我正在开发一个在首页上有多个链接的项目。如果单击链接,应用程序将被路由到相应的页面,但会有一些延迟。在此延迟期间,应用程序显示加载程但是,只有在我第一次点击链接时才会显示加载程序。当我回到第一页然后点击链接加载器没有出现时,它不会出现。可能是什么原因,我怎么能解决这个问题?以下是HTML代码段:

<template>
   
    <!-- MAIN MENU START -->
    <require from="bootstrap/css/bootstrap.css"></require>
 

    <nav class="navbar navbar-default topMenu" role="navigation">
        <!-- Brand and toggle get grouped for better mobile display -->
        <div class="container-fluid">
            <!-- Remove button that appears for xs devices
                
                <div class="navbar-header">
               <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-collapse-1">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button> 
            </div>-->
            <a class="navbar-brand nameEllipsis" id="routeTitle">${router.title}</a>
            <!-- Collect the nav links, forms, and other content for toggling
                .Remove this div to remove collapse features
                .change display of both ul to inline-block so that they appear inline
                .float 2nd ul to right to bring li to right and inline
                .float 1st li of 2nd ul to left so that it displays according to the format of md and lg devices
            <div class="collapse navbar-collapse" id="navbar-collapse-1"> -->
                <ul  style="display:inline-block;"   class="nav navbar-nav navbar-left">
                    <li ><a  href="#"><span class="fa fa-home"></span></a></li>
                </ul>
                <ul style="float:right;display:inline-block;" id="navigatingIcons" class="nav navbar-nav navbar-right">
                    <li style="float:left;" ><a href="#"><span class="fa fa-filter"></span></a></li>
                    <li  ><a href="#"><span class="fa fa-cog"></span></a></li>
                    <li  class="loader" show.bind="router.isNavigating">
                        <i class="fa fa-spinner fa-spin fa-2x"></i>
                    </li>
                </ul>
        <!-- </div>-->   <!-- /.navbar-collapse -->
        </div>
    </nav>

    <div class="">
        <router-view></router-view>
    </div>



</template>
enter image description here 第一次应用应用程序时的上图。此外,aurelia-hide类首次不存在。enter image description here 在第一次应用程序路由后,上面的图像,aurelia-hide类不会被删除,加载器也不会出现。 感谢。

0 个答案:

没有答案