Sunday, 30 April 2017

Router-outlet error in Angular 4 app that uses node.js API

I have an Angular 4 application that mainly uses node.js API for functioning. I have a problem with child router-outlet since it doesn't load until I check if user is logged in and I get the error: Uncaught (in promise): Error: Cannot find primary outlet to load 'AllPostsComponent'. My angular html code is:

<div class="container-fluid text-center mainDiv" *ngIf="IsUserIn">
    <div class="row">
        <div class="col-sm-2 sidenav"></div>
        <div class="col-sm-8 text-center middleDiv">
            <router-outlet></router-outlet>
        </div>
        <div class="col-sm-2 sidenav"></div>
    </div>
<footer class="container-fluid text-center"></footer>
</div>

And my Angular ts class code is:

  user: JSON;
  status: JSON;
  IsUserIn: boolean;
  constructor (private userService: UserService, private router: Router) { }

  logout(){
    this.userService
    .logout()
    .subscribe(result => this.user = result, error => console.log("Error: ",error), () => this.router.navigate(['login']));
  }

  checkStatus(){
    this.userService
    .checkStatus()
    .subscribe(result => this.status = result, error => console.log("Error: ",error), () => {console.log(this.status); this.IsUserIn = (JSON.stringify(this.status) == "true"); if(this.IsUserIn == false){this.router.navigate(['login'])};});
  }

  ngOnInit(){
    this.checkStatus();
  }

I know the problem appears because of the *ngIf="IsUserIn" part of the code, but I don't know how to fix this problem, so I could still check if user is logged in in my parent route. Can anyone help me please? Thank you in beforehand.



via Luki

No comments:

Post a Comment