Impossible d'arrêter l'intervalle Observable

Question

J'ai essayé à peu près tout ce que je peux trouver et je n'arrive pas à obtenir cet intervalle pour arrêter de faire le code dans l'abonnement. Suis-je en utilisant l'intervalle faux?

var subject = new Subject(); 
var interval = Observable.interval(this.settings.timing * 1000); 
var subscription = interval 
    .takeUntil(subject) 
    .subscribe(t => { 
    console.log('pushing new item'); 
    this.activeItems[0].contentLeaving = true; 
    setTimeout(()=>{ 
    this.activeItems[0].imageLeaving = true; 
    setTimeout(()=>{ 
     this.activeItems.push(this.activeItems.shift()); 
     setTimeout(()=>{ 
     this.activeItems[1].contentLeaving = false; 
     this.activeItems[1].imageLeaving = false; 
     },510); 
    },510); 
    },510); 
}); 
this.moduleProps.intervals.push(subject); 

Dans mon ngOnDestroy

this.moduleProps.intervals.forEach((i)=>{ 
    i.complete(); 
}); 

Mais après cela arrive, je vois encore la déclaration de journal de la console en disant « pousser nouvel élément » comme si elle est toujours en cours d'exécution sur mon intervalle.

Answer 1

Selon cette documentation (https://www.learnrxjs.io/operators/filtering/takeuntil.html), takeUntil émet jusqu'à ce que l'observable fourni émette. Vous complétez l'observable sans rien émettre. Essayez d'ajouter .next() à votre méthode onDestroy.

this.moduleProps.intervals.forEach((i)=>{ 
    i.next(); // have subject emit 
    i.complete(); 
}); 

Voici un Plunk de travail (https://plnkr.co/edit/Zdf8C9d8vHk84uIMYHvH?p=preview)

Answer 2

Essayez .takeWhile au lieu de .takeUntil, il peut utiliser un booléen.

private finished = false; // component property 

var interval = Observable.interval(this.settings.timing * 1000); 
var subscription = interval 
    .takeWhile(_ => this.finished) 
    .subscribe(t => { 
    ... 

OnDestroy est alors simplement this.finished = true;