使用 ngIf 创建条件部分

Question

我希望通过条件逻辑实现应用程序范围的导航和子导航组合，以在特定页面上显示侧导航。我在这里尝试了 routerLink 帖子上的一些 ngIf，但没有一个解决了我的问题。 如 Clarity 文档所述，app.component.html 是我的主要容器、标题和子导航。 app.component.html

<div class="main-container">
   <header class="header">
   </header>

   <nav class="subnav">
   </nav>

   <div class="content-container">
      <div class="content-area">
         <router-outlet></router-outlet>
      </div>

      <nav *ngIf="router.url === '/page'" class="sidenav">
      </nav>
   </div>
</div>

app.component.ts

class PageComponent {
    constructor(public router: Router) {

    }
}

Answer 1

您的应用程序中可以有两种不同的布局

1. Blank Layout //没有侧边栏
2. 主布局 //它有你的侧边栏

您的router 将如下所示

const routes: Routes = [
 {
    path: '',
    component: BlankLayoutComponent,
    children: [
        { path: '', redirectTo: 'logincustomer',pathMatch:'full' },
        { path: 'logincustomer', component: LoginComponent }
    ]
  },
{

    path: 'user',
    component: MainLayoutComponent,
    canActivate: [AuthGuard],
    children: [
         { path: 'user', redirectTo:'dashboard', pathMatch: 'full', canActivate: [AuthGuard] }]
 };