CODEWITHSUNDEEP
angularangular-routingangular-router
az rnd
az rnd

Reputation: 883

Not able to load contents router-outlet

I am trying to change the router outlet based on the authentication. My code is like below

<div *ngIf="isLoggedIn" class="layout-wrapper layout-2" [ngClass]="{'layout-loading': !initialized}">
  <div class="layout-inner">
    <app-layout-sidenav></app-layout-sidenav>

    <div class="layout-container">
      <app-layout-navbar></app-layout-navbar>

      <div class="layout-content">
        <div class="container-fluid router-transitions flex-grow-1 container-p-y">
          <router-outlet></router-outlet>
        </div>

        <app-layout-footer></app-layout-footer>
      </div>
    </div>
  </div>
</div>
<div class="layout-overlay" (click)="closeSidenav()"></div>

<ng-container *ngIf="!isLoggedIn">
  <router-outlet></router-outlet>
</ng-container>

Here, the login screen is working fine but after login, I am not able to load the contents from authenticated routes. But If I fully refresh the page and it's working.

Also, I have tried with outlet name but it was also not working

Could anyone resolve this problem?

Thanks in advance

Upvotes: 1

Views: 402

Answers (1)

Naren Murali
Naren Murali

Reputation: 56670

I think the below code is the problem, kindly change it to

Before:

<ng-container *ngIf="!isLoggedIn">
  <router-outlet></router-outlet>
</ng-container>

After:

  <router-outlet></router-outlet>

If you want to implement authorization go for canActivate in routing, this is the standard way to do it!

Upvotes: 2

Related Questions