Ufdjrw

I am working in angular(2) and more and more I get into situation where I need to wait for angular to do its magic and then execute my code.
all its actually means is just to put the action in the end of the call stack(which I achieve right now by setting a time-out for 0 ms and a comment explaining my actions).
But that seems like being a smart ass.
I heard people talking about ngOnChange, but that seems even worse, I mean on every change of every element I need to execute this code which happens in such rare cases?

recent example would be when user changes view, I want the video to start playing(same component).

edit:

here is some code to visualize the problem(solving it is not the issue, since I have other cases when I need to place items on the back of the call stack):

switchInnerAddRuleView(innerView: string): void 
 this.innerAddRuleView = innerView;
 if (innerView === 'camera') 
 setTimeout( _ => this.videoPlayOn(0, true) , 0);
 


videoPlayOn(time: number, isPolygon: boolean = false): void 
 const videoPlayerElement: string = (isPolygon) ? 
 'elPolygonVideoPlayer' : 'elVideoPlayer';
 this[videoPlayerElement].nativeElement.currentTime = time;
 if (this[videoPlayerElement].nativeElement.paused) 
 this[videoPlayerElement].nativeElement.play();
 

template:

<button (click)="switchInnerAddRuleView('camera')"><button>
<div *ngIf="innerAddRuleView === 'camera'" class="step-two">
 <video #polygonVideoPlayer preload="auto" class="video" [src]="currentDetectionOnView.camera.liveStreamUrl"></video>
 </div>

So my question is, how do I put something on the end of the call stack in the correct way? or is setTimeout the only option I have?

maybe use the ngAfterViewInit and execute the code there

https://angular.io/guide/lifecycle-hooks

Your component should implement OnChanges instead of OnInit
and do the required action in ngOnChanges() func

ngOnChanges(){
 if (this.innerAddRuleView === 'camera') 
 this.videoPlayOn(0, true);