clearInterval() funktioniert nicht

Question

Ich muss das Intervall auf mouseenter Ereignis starten und ich muss es auf mouseleave stoppen.

‚clearInterval‘ Anhalten nicht das Intervall, wenn ‚setInterval‘ wird gestartet, indem ‚MouseEnter-‘ Ereignis, während es ordnungsgemäß funktioniert, wenn ‚setInterval‘ wird gestartet, indem ‚mousedown-‘ event

demo.ts

interval_bs:any; 
    startInterval(){  
    this.interval_bs=setInterval(()=>{ 
     if(this.activeIndex<3){ 
     this.activeIndex+=1; 
     } 
     else{ 
     this.activeIndex=0; 
     }  
    },2000) 
    } 

    stopInterval(){ 
    clearInterval(this.interval_bs); 
    } 

demo.html

<div (mouseenter)="startInterval()" (mouseleave)="stopInterval()" >  
     <ng-template ngFor let-bs [ngForOf]="back_screens" let-bsi="index" > 
     <img [src]="bs.image" *ngIf="activeIndex==bsi" > 
     </ng-template> 
</div> 

Answer 1

Jetzt Problem gelöst wurde. Deklariere eine Variable 'start_count' und initialisiere sie auf Null. bei Ereignis '(mouseleave)', 'start_count' auf Null zurücksetzen. Jetzt auf ‚(MouseEnter-)‘ Ereignis der ‚start_count‘ erhöhen und eine Bedingung ‚setInterval()‘ Methode

interval_bs:any; 
start_count:number=0; 
startInterval(){ 
    this.start_count+=1; 
    if(this.start_count==1){ 
     this.interval_bs=setInterval(()=>{ 
     if(this.activeIndex<3){ 
      this.activeIndex+=1; 
     } 
     else{ 
      this.activeIndex=0; 
     }   
     },2000)  
    } 

    } 

    stopInterval(){ 
    this.start_count=0; 
    clearInterval(this.interval_bs); 
    }