M
getBanner$ = this.cmsService.getDesktopBanner().pipe(А мне говорят:
takeUntil(this.unsubscribe$),
map(res => _.cloneDeep(res)),
map(res => res.map(el => {
el.image = this.domSanitizer.bypassSecurityTrustUrl(el.image);
return el;
}))
);
ngOnInit(): void {
this.getBanner$.subscribe((res) => {
this.imageList = res.slice();
console.log(this.imageList);
if (this.imageList.length > 1) {
this.intervalSlider(); // тут я типа запускаю слайдер
}
});
}
С таким подходом переменна imageList не имеет смысла, так можно напрямую использовать getBanner$. То есть вместо подписи использовать оператор tap (чтобы запустить интервал). либо же в map. Ну и тогда
getBanner$ превратится в banners$
getBanners$ = this.cmsService.getDesktopBanner().pipe(Тогда не нужна начинка ngOnInit(). А в шаблоне *ngFor="let image of (banners$ | async); let i = index"
takeUntil(this.unsubscribe$),
map(res => this.configUtilService.getArray(res)),
map(res => _.cloneDeep(res)),
// map((res: any) => res.sort((a, b) => a.order - b.order)),
map(res => res.map(el => {
el.image = this.domSanitizer.bypassSecurityTrustUrl(el.image);
return el;
})),
tap((res: any[]) => {
if (res.length > 1) {
this.intervalSlider();
}
})
);
Моя мысль:
Я считаю, что в pipe не нужно делать действия, которые могут изменять шаблон компонента, плюс это усложняет тестирование.
Что думаете?
никто не запрещает выполнять в pipe функции которые что-то меняют в компоненте.
Я лично за второй вариант (с функцией в pipe), т.к. тогда будет меньше кода (без onInit, onDestroy), и async pipe будет следить за отпиской (у вас она кстати неправильно сделана, takeUntil не должен идти первым https://cartant.medium.com/rxjs-avoiding-takeuntil-leaks-fb5182d047ef )