Rehan Shah
Rehan Shah

Reputation: 1627

Pass child to parent component (child render in router-outlet) ? in Angular?

I have been working on a project and I got a situation where I am currently stuck. #situation: I have a child component that is registered in app routes. So which is rendering from router-outlet in the main component which is app.component.ts. and there the navbar component is rendering as well. So the problem is that in a child component something happens I want to notify the navbar component. for that, I can't achieve this using Output() parameter because the component is rendering inside a router-outlet dynamically. So kindly let me know how to do that. Help will be very appreciated.

here is my app.component.html code.

<app-nav *ngIf="_authService._isLoggedIn()"></app-nav>
<div class="container-fluid">
  <app-login *ngIf="!_authService._isLoggedIn()"></app-login>
    <div class="col-md-9">
      <router-outlet *ngIf="_authService._isLoggedIn()"></router-outlet>
    </div>
  </div>
</div>

Upvotes: 1

Views: 566

Answers (1)

you can use subjects in a service for example:

someThing = new BehaviorSubject<number>(0);
currentsomeThing = this.someThing.asObservable();

change currrentSomething in child with this:

this.examleService.someThing.next(digit);

and subscribe this in navbar:

this.examleService.currentsomeThing.subscribe(res => ...)

Upvotes: 1

Related Questions