Angular 4注销问题

Question

我在角度应用程序中有一些组件，如页眉，页脚，侧边栏，登录，管理员等。 由于某些原因，现在不应在登录页面中显示标题和侧边栏。但管理员等其他组件应该看到标题和侧边栏。出于这个原因，在app.component.html我做了如下：

<div id="app">

<app-header *ngIf="router.url !== '/'"></app-header>
<!-- END HEADER -->


<div class="clearfix">
</div>
<!-- BEGIN CONTAINER -->
<div class="page-container">

<div *ngIf="router.url !== '/'"><app-sidebar></app-sidebar> </div>

  <div class="page-content-wrapper">

    <div class="page-content">



      <router-outlet>
      </router-outlet>
      <app-new-patient></app-new-patient>

    </div>
  </div>
</div>


<app-footer></app-footer>
</div>

现在问题是当我想退出时显示错误。

在header.component.ts

中

logout() {
    localStorage.removeItem('currentUser');
    this.router.navigateByUrl('/');
  }

在header.component.html

中

<li>
   <a ng-click="logout()" href="">
   <i class="icon-key"></i> Log Out </a>
</li>

路线

const APP_ROUTES: Routes=[
{path:'', component: LoginComponent},
{path:'admin', canActivate:[AuthguardGuard], component: AdminComponent},
{path: 'search',  component: PatientSearchComponent },
];

错误消息

你能帮我吗？

Answer 1

使用navigateByUrl方法，因为它需要绝对路径。

您的代码将在当前路由的末尾添加斜杠，并且没有记录此错误的此类定义

更新1： 添加pathMatch并按路径定义的顺序将其移动到最后

{path:'', component: LoginComponent, pathMatch: 'full' },