CODEWITHSUNDEEP
angular
Maihan Nijat
Maihan Nijat

Reputation: 9355

Angular App crashes in production using conditional layout

I have two layouts and each loads with condition:

<app-layout-w *ngIf="!p || p === 1">
  <router-outlet></router-outlet>
</app-layout-w>

<app-layout-o *ngIf="p === 6">
  <router-outlet></router-outlet>
</app-layout-o>

And the ts:

ngOnInit() {

 const subscription = this.authService.getToken().subscribe(token => {
  const payload = new NbAuthJWTToken(token.getValue(),
    token.getOwnerStrategyName(), token.getCreatedAt()).getPayload();
  if (payload) {
    this.p = payload.provider;
  }
 });

 this.userService.isAuthenticated.subscribe(isAuthenticate => {
    if (!isAuthenticate) {
      this.openDialog();
    }
 });

}

The error I have is:

ERROR TypeError: "this.container is null"

The error is caused by openDialog(). What I noticed is that the layout is not loaded at all. I am using ChangeDetectionStrategy.OnPush.

Comment out the openDialog() avoids the error but a blank white page. No errors and nothing loading up.

Upvotes: 0

Views: 217

Answers (1)

dota2pro
dota2pro

Reputation: 7866

this.userService.isAuthenticated.subscribe(isAuthenticate = > {
    if (!isAuthenticate) {
        this.changeDetectorRef.detectChanges();
        this.openDialog();
    }
});

Upvotes: 1

Related Questions