Script to automatically click a button repetitively in Angular

Issue

I have a button that needs to be pressed repetitively every 5 seconds automatically.

The button is defined as :

<button id="refresh" class="btn- fa fa-refresh" aria-hidden="true" value="referesh" (click)="ngOnInit()">&nbsp; Refresh</button>

After looking for solutions I wrote this code:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script type="text/javascript">
setInterval(function(){
  $('#refresh').trigger('click');
}, 5000);
</script>

Though the above script worked in a HTML env., it didn't work in the angular scenario.

I am completely new to Angular and can't figure out how to do this. Any help would be highly appreciated!

Solution

Try pressing the button the angular way

like this

<button #myButton id="refresh" class="btn- fa fa-refresh" aria-hidden="true" value="referesh" (click)="triggerClick()">&nbsp; Refresh</button>

and in your typescript, give myButton a ViewChild reference

@ViewChild('myButton') myButton : ElementRef;

triggerClick() {
    let el: HTMLElement = this.myButton.nativeElement as HTMLElement;
    setTimeout(()=> el.click(), 5000);
}

Answered By - Ajanth