title: Maximum call stack size exceeded (Angular8)
body: <p>I'm Trying to do the below in Angular, I can't understand where is the problem?
  understand that this is a recursive function but in javascript there is a lot of workarounds to solve this, I tried them here but they did not work out
  do you have any work around for this?</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>import { Component, OnInit } from '@angular/core';
  
  @Component({
    selector: 'app-header',
    templateUrl: './header.component.html',
    styleUrls: ['./header.component.scss']
  })
  export class HeaderComponent implements OnInit {
    constructor() {}
  
    changeImg = () =&gt; {
      let i = 0;
      const time = 1000;
      const images = [
        '../../assets/imgs/dashboard_full_1.webp',
        '../../assets/imgs/dashboard_full_2.webp'
      ];
      document.slide.src = images[i];
      if (i &lt; images.length - 1) {
        i++;
      } else {
        i = 0;
      }
  
      setTimeout(this.changeImg(), time);
    };
  
    ngOnInit() {
      this.changeImg();
    }
  }</code></pre>
  </div>
  </div>
  </p>