Rxjs switchMap - > concatMap - > toArray没有对Amray做出反应

时间:2018-03-11 11:02:33

标签: javascript rxjs observable rxjs5

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并想写一个滑块进行学习。

感谢您的帮助

0 个答案:

没有答案