Can I disable bootstrap carausel which is in background for one of the 4 tabs in angular project? -
i've single page tab based angular website bootstrap carausel in background.
in there separate component background , have <app-background></app-background>
in app.html
make work.
this works perfect 4 tabs of website, want disable background carausel 1 one tab out of 4 tabs.
i tried restructuring code inserted <app-background></app-background>
in required tabs didn't seem have worked.
so in nutshell, there way can disable background carausel 1 tab?
any appreciated.
apologies couldn't paste code snippet there different bits of components , pasting not idea.
yes can, since didn't post code, answer have assumptions.
in <app-background>
component, add ngif
condition , bind variable e.g.
<div id="mycarousel" class="carousel slide" data-ride="carousel" *ngif="iscarouselhidden">
create data sharing service emitting event:
import { injectable, eventemitter } '@angular/core'; @injectable() export class datasharingservice { public oncarouselshowhide = new eventemitter<boolean>(); public carouselshowhide (ishidden: boolean): void { this.oncarouselshowhide.next(ishidden); } }
.. , subscribe event in <app-background>
component in in ngoninit:
constructor(private readonly datasharingservice: datasharingservice) { } ngoninit() { this.datasharingservice.oncarouselshowhide.subscribe(value => { this.iscarouselhidden= value; }); }
now, in navbar
component, when click on tabs, call carouselshowhide
method show or hide carousel.
the other possibility use @input
& @output
communicate between components (documentation here) @arg0n
mentioned in comments. have not worked cant write example. using first approach in project.
Comments
Post a Comment