Question

我正在尝试为我的应用程序实现路由。当我从树中的第一个组件进行路由时，就可以了（如应用程序菜单或搜索），但是当我处于子组件（事件项或标签）中时，我的应用程序会闪烁：它将显示好页面几秒钟（以一种很好的方式，我的意思是菜单和搜索都可以很好地显示（无需重新加载），并且结果页面可以按需显示在路由器出口中），然后返回到整个根路由（因此是一个履历表） -收费页面。我的路线代码是

(app.module.ts)

const appRoutes: Routes = [
  { path: 'profile', component: ProfileComponent },
  { path: 'resume', component: ResumeComponent },
  { path: 'result/:searchType', component: ResultComponent },
  { path: '', component: ResumeComponent }
];

我的结构：

app-root
    app-search
    app-menu
       app-event-item
    app-resume
       app-sticker
    app-profile
    app-result

提取应用程序根组件的HTML代码：

 <div>
   <div id="wrapper">

     <!-- Navigation -->
     <nav class="navbar navbar-default navbar-static-top" role="navigation" style="margin-bottom: 0">

       <app-menu></app-menu>

       <!-- TODO before supp -->

       <div class="navbar-default sidebar" role="navigation">
         <div class="sidebar-nav navbar-collapse">
           <ul class="nav" id="side-menu">
             <app-search></app-search>
           </ul>
         </div>
       </div>

     </nav>
     <div id="page-wrapper">
       <router-outlet></router-outlet>
     </div>
   </div>
 </div>

我的代码很简单：

 <a routerLink="xxxx">[...]</a>

其中xxxx是我的路由页面；这就是我在每个导航链接（一个或一个按钮或任何其他按钮）上所做的事情，哪些在起作用，哪些在不起作用。我没有js代码来管理路由。我认为这足以满足我的需求。例如：

<a routerLink="profile">[...]</a>

我尝试添加考虑相对/绝对问题的“ /”，但这似乎不是我的问题... 谢谢！

Answer 1

实际上我发现了我的错误该链接嵌入到另一个具有

的“ a”标签中

<a href="#">
  [... some code]
     <a routerLink="xxxx">[...]</a>
  [... some code]
</a>

当我删除href时，一切正常。

<a>
  [... some code]
     <a routerLink="xxxx">[...]</a>
  [... some code]
</a>

来自childs组件的路由“闪烁”我的导航

1 个答案: