const allAnimatedElement$ = ($val: JQuery) => from($val).pipe(
map(val => $(val)),
concatMap($val => animateElement$($val)),
toArray(),
tap(val => console.log(`all: ${val}`)),
)
const animateDescription$ = nonStopedStream$.pipe(
map(val => $('return array')),
// switchMap($val => allAnimatedElement$($val)),
switchMap($val => from($val).pipe(finalize(() => console.log('end arr')))),
map(val => $(val)),
concatMap($val => animateElement$($val)),
toArray(),
tap(val => console.log(`all: ${val}`)),,
);
const animateElement$ = ($element: JQuery): Observable<JQuery> =>
new Observable((observer: Observer<any>) => {
const initialWidth = $element.width();
$element.css({ width: 0, opacity: 1 }).velocity(
{ width: initialWidth },
{
duration: 1000,
complete() {
observer.next($element);
observer.complete();
},
}
);
});
第一个switchMap按预期执行(查看所有消息),但第二个 - 看不到所有消息。如何在第二个switchMap中修复它?
最后,我希望对前一个元素和当前元素进行数组除法,然后当不间断发出新值时,异步为当前数组设置动画,并将前一个数组恢复到初始位置。
我只是研究rxjs并想写一个滑块进行学习。
感谢您的帮助