Argthtjtr

I'm looking to implement an application wide nav and subnav combination with conditional logic that shows a sidenav on a specific page. I've tried a few of the ngIf on routerLink posts here, but none have solved my issue.
app.component.html is my main container, header, and subnav, as described by the Clarity docs.
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) {



    }

}

You can have two different layouts in your application

1. Blank Layout //it has no sidebar


2. Main Layout //it has your sidebar

Your router will look like this

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] }]

 };