TypeError: You provided 'function selectOperator(source$) where a stream is expected

Viewed 169

I was trying to create a reusable selector pipe by following the ngrx documentation.

I have this in several of my components, so i want to create a reusable selector

    this.bookmarks$ = this.store.pipe(
      select(fromBookmarks.selectBookmarksLoading),
      filter(loading => loading === false),
      concatMap(loading =>
        of(loading).pipe(
          withLatestFrom(
            this.store.select(fromBookmarks.selectCurrentBookmarks),
            (_, bookmarks) => {
              return bookmarks;
            }
          )
        )
      )
    );

So i came up with this one.

export const selectBookmarksAfterLoad = pipe(
  select(selectBookmarksLoading),
  filter(loading => loading === false),
  concatMap(loading =>
    of(loading).pipe(
      withLatestFrom(select(selectCurrentBookmarks), (_, bookmarks) => {
        return bookmarks;
      })
    )
  )
);

and converted the selector in my components like this

    this.bookmarks$ = this.store.pipe(fromBookmarks.selectBookmarksAfterLoad);

but i'm getting error such as this one:

rollbar.umd.min.js:1 TypeError: You provided 'function selectOperator(source$) {
        /** @type {?} */
        let mapped$;
        if (typeof pathOrMapFn === 'string') {
            /** @type {?} */
            const pathSlices = [(/** @type {?} */ (propsOrPath)), ...paths].filter(Boolean);
            mapped$ = source$.pipe(Object(rxjs_operators__WEBPACK_IMPORTED_MODULE_2__["pluck"])(pathOrMapFn, ...pathSlices));
        }
        else if (typeof pathOrMapFn === 'function') {
            mapped$ = source$.pipe(Object(rxjs_operators__WEBPACK_IMPORTED_MODULE_2__["map"])((/**
             * @param {?} source
             * @return {?}
             */
            (source) => pathOrMapFn(source, (/** @type {?} */ (propsOrPath))))));
        }
        else {
            throw new TypeError(`Unexpected type '${typeof pathOrMapFn}' in select operator,` +
                ` expected 'string' or 'function'`);
        }
        return mapped$.pipe(Object(rxjs_operators__WEBPACK_IMPORTED_MODULE_2__["distinctUntilChanged"])());
    }' where a stream was expected. You can provide an Observable, Promise, Array, or Iterable.
0 Answers
Related