angular - parent-component-binding with *ngIf on a shared service is not updated when triggered from child component -
i have parent , child component. parent component has menu. when child component says this.service.ismenuvisible(false) menu still visible in parent component. no error.
afair angular checks updates parent down children components, means try change expression after parent component checked...
how should correctly fix scenario shared singleton service?
export class routerservice { public id: number = 0; constructor(private router: router,private route: activatedroute) { this.router.events.subscribe(event => { if (event instanceof routesrecognized) { if (event.url == "/projects/create") { console.log(event.url) this.setismenuvisible(false); } else { console.log(event.url); this.setismenuvisible(true); } var first = event.state.root.firstchild.firstchild; var id = first && event.state.root.firstchild.firstchild.params['id']; this.id = +id; } }); } private ismenuvisible: behaviorsubject<boolean> = new behaviorsubject(false); setismenuvisible(ismenuvisible: boolean): void { this.ismenuvisible.next(ismenuvisible); } getismenuvisible(): observable<boolean> { return this.ismenuvisible.asobservable(); } }
parent component
ngoninit() { this.service.id === 0 ? this.service.setismenuvisible(false) : this.service.setismenuvisible(true); }
html
<ul class="navbar-nav ml-auto mx-4" *ngif="service.getismenuvisible"> ... </ul>
child component
ngoninit() { this.service.setismenuvisible(false); }
have child supply value ismenuvisible via eventemitter parent, , have parent use set this.service.ismenuvisible
Comments
Post a Comment