Estoy usando NgRx en mi proyecto Angular. Quiero acceder a los productos que están almacenados en mi tienda desde mi ProductsComponent .
ProductsComponent.ts
... import { select, Store } from '@ngrx/store'; ... constructor(private store: Store<any>) {}Me pregunto cuál es la diferencia entre:
public products = this.store.select(selectProducts);y
public products = this.store.pipe(select(selectProducts));y cual debo usar.
La nueva sintaxis preferida es
public products = this.store.pipe(select(selectProducts)); La sintaxis this.store.select está en desuso:
/** * @deprecated Selectors with props are deprecated, for more info see {@link https://github.com/ngrx/platform/issues/2980 Github Issue} */ select<K, Props = any>( mapFn: (state: T, props: Props) => K, props: Props ): Observable<K>;Vea el código fuente aquí: https://github.com/ngrx/platform/blob/master/modules/store/src/store.ts#L27-L33
Han cambiado eso desde que Rxjs pasó de una API encadenada a una componible (usando tubería e importando los operadores que necesita). Esto ha permitido sacudir árboles en Rxjs y Ngrx ahora recomienda el nuevo patrón.
Ambos métodos de selección se comportan igual y tienen la misma funcionalidad. La diferencia es que uno es un método en la tienda, mientras que el otro es una tubería RxJS.
El equipo de NgRx promueve el uso de store.select porque es más fácil de usar (no es necesario importar el operador). Incluso hay un estilo de selección de regla eslint que anima a usar store.select .