Angular Observable destroy с takeUntil: что происходит, когда в ngOnDestroy отсутствует .next () - PullRequest
Новая
       72

Angular Observable destroy с takeUntil: что происходит, когда в ngOnDestroy отсутствует .next ()

1 голос
/ 17 октября 2019

В Angular 7 Component я использую takeUntil () RxJS для правильной отмены подписки на наблюдаемые подписки.

  • Что происходит, когда в методе ngOnDestroy отсутствует this.destroy$.next() (см. Примерниже)? Будет ли он по-прежнему отменять подписку?
  • Что произойдет, если в методе ngOnDestroy отсутствует this.destroy$.complete() (см. Пример ниже)? Будет ли он по-прежнему отменять подписку?
  • Есть ли способ принудительно использовать этот шаблон с помощью takeUntil () для отмены подписки (например, правило tslint, пакет npm)? 

@Component({
    selector: 'app-flights',
    templateUrl: './flights.component.html'
})
export class FlightsComponent implements OnDestroy, OnInit {
    private readonly destroy$ = new Subject();

    public flights: FlightModel[];

    constructor(private readonly flightService: FlightService) { }

    ngOnInit() {
        this.flightService.getAll()
            .pipe(takeUntil(this.destroy$))
            .subscribe(flights => this.flights = flights);
    }

    ngOnDestroy() {
        this.destroy$.next();
        this.destroy$.complete();
    }
}

Ответы [ 3 ]

1 голос
/ 17 октября 2019
  1. takeUntil принимает следующий как эмиссия. Если только complete() позвонил, это не отписаться

попробуйте это: 

const a=new Subject();
interval(1000).pipe(takeUntil(a)).subscribe(console.log);
timer(3000).subscribe(_=>a.complete())
this.destroy$ все еще находится в памяти и не будет собирать мусор Не то, чтобы я знал о

Пожалуйста, также посмотрите здесь, чтобы избежать утечки памяти, когдаиспользуя takeUntil

https://blog.angularindepth.com/rxjs-avoiding-takeuntil-leaks-fb5182d047ef

Лично я предпочитаю явное unsubscribe при уничтожении

0 голосов
/ 17 октября 2019

Привет использовать takeWhile вместо takeUntil . 

@Component({
    selector: 'app-flights',
    templateUrl: './flights.component.html'
})
export class FlightsComponent implements OnDestroy, OnInit {
    private readonly destroy$ = new Subject();
    alive = true;
    public flights: FlightModel[];

    constructor(private readonly flightService: FlightService) { }

    ngOnInit() {
        this.flightService.getAll()
            .pipe(takeWhile(() => this.alive))
            .subscribe(flights => this.flights = flights);
    }

    ngOnDestroy() {
        this.alive = false;
        this.destroy$.complete();
    }
}
0 голосов
/ 17 октября 2019

this.destroy$.next() вызывает субъект, который запускает оператор takeUntil, который завершает подписку flightService.getAll().

this.destroy$.complete() завершает субъект destroy$ при уничтожении компонента.

...