*ngIf check if element currently getting shown on page or not.
I have two sibling component. Component A having a some text value say 'SOME_TEXT' Now in html of Component B, I need check for span element.
If 'SOME_TEXT' is getting shown currently on page/app then *ngIf should be false. Meaning span tag in component B should NOT be shown.
Has anyone encountered this. ?
Thanks.
I'm not sure about the question, but I think you could use DOM to get the element in component A at somewhere of component B's script.
For example, inside component B's ngOnInit get some value from
document.getElementById("id in A html")
or
Use Service and power of Observable
@Injectable({
providedIn: 'root'
})
export class TextService {
textObserver: Observer<string>|undefined
text: Observable<string> = new Observable()
updateText(val: string) {
if (!this.textObserver) {
this.text = new Observable((observer: Observer<string>) => {
this.textObserver = observer
this.textObserver.next(val)
})
this.text.subscribe()
return;
}
this.textObserver?.next(val)
}
}
In somewhere of component A you can call updateText to set text and in component B you can do this.textService.text.subscribe(text => // your code) to get text and use in html view