NGRX createSelector object get middle line, when create special selector with filter (Update to NGRX 2021)

Question

Hello guys I am create a selector that filter some thinks from the store but when I implement that on selectors it create a line on the object.

The selector work properly but I see middle line on it like something isn't 100% well.

How can I fix it? Thanks for your help!

product.selector.ts

export const getAllProducts = createSelector(getProductsState, fromProduct.getAllProducts);

// createSelector with line in middle.
export const getProductsFilter = createSelector(
    getAllProducts,
    (products: IProduct[], filterData: string) => {

        if (filterData === '')
            return products;
        else
            return products.filter(value => value.name.includes(filterData) || value?.description.includes(filterData));

    }

);

from home component

      const data:string='data';
      this.subscription.push(this.store.pipe(select(getProductsFilter, data)).subscribe(....

All create with Ngrx && ngrx entities update to last version 2021.

When my mouse on createSelector show that message

The signature '(s1: SelectorWithProps<object, string, IProduct[]>, projector: (s1: IProduct[], props: string) => IProduct[]): MemoizedSelectorWithProps<object, string, IProduct[], DefaultProjectorFn<...>>' of 'createSelector' is deprecated.ts(6387)
selector.d.ts(32, 4): The declaration was marked as deprecated here.

Remember it work, but this line feel something wrong.

A small picture

It work, but why is not mention on NGRX website? https://ngrx.io/guide/store/selectors — Lichay Tiram, Jun 22 '21 at 19:49
It is: https://ngrx.io/guide/store/selectors#using-selectors-with-props — R. Richards, Jun 22 '21 at 21:34
`(counter, props) => counter * props.multiply` it wrong way because it use js way instead parsing value inside select arguments. On github it show the right way as you sent above — Lichay Tiram, Jun 23 '21 at 10:23

SWilko · Accepted Answer · 2021-06-25T11:49:30.643

2

As said in the comments above selectors with props are deprecated You just need to rewrite your selector as a factory selector

export const getProductsFilter = (props: { filterData: string }) => 
  createSelector(
    getAllProducts,
    (products: IProduct[]) => {
      if (props.filterData === '')
          return products;
      else
          return products.filter(value => value.name.includes(props.filterData) || value?.description.includes(props.filterData));
   }
);

edited Jun 25 '21 at 11:49

answered Jun 23 '21 at 08:48

SWilko

3,542
1
16
26

1

Yes bro I did it as he said above and it work well, only little change instead props and crate object I did it clean with `filterData: string` without that Object (props) work same – Lichay Tiram Jun 23 '21 at 10:21

NGRX createSelector object get middle line, when create special selector with filter (Update to NGRX 2021)

1 Answers1