J'ai le morceau de code suivant. Ce que j'essaie de réaliser est de rediriger vers la page introuvable lorsque la fonction "find" ne trouve aucun objet order dans les commandes chargées observables.

private order: Observable<OrderModel>;

ngOnInit() {
    this.route.params.subscribe(params => {
    this.name = params.id;
    this.order = this.orderService.ordersLoaded.pipe(map((orders: OrderModel[]) => orders
          .find((order: OrderModel) => order.orderName === this.name.toUpperCase())));
 });

J'ai essayé quelque chose comme:

ngOnInit() {
    this.route.params.subscribe(params => {
    this.name = params.id;
    this.order = this.orderService.ordersLoaded.pipe(map((orders: OrderModel[]) => orders
        .find((order: OrderModel) => order.orderName === this.name.toUpperCase()),
        defaultIfEmpty(this.router.navigate(['/notFound']))
      ));
 });

Mais il me redirige toujours vers le composant page introuvable.

1
supercolo 4 nov. 2019 à 15:15

1 réponse

Vous pouvez appuyer sur l'opérateur pour archiver ce que vous voulez:

this.order = this.orderService.ordersLoaded.pipe(
      map((orders: OrderModel[]) => orders.find(order => order.orderName === this.name.toUpperCase()),
      tap(order => {
        if (!order) {
          this.router.navigate(['/notFound']);
        }
      })
    ));

Vous pouvez créer quelques opérateurs rxjs personnalisés pour vous débarrasser de if:

export function tapIf<T>(
  predicate: (value: T) => boolean,
  fn: (x: T) => void
): MonoTypeOperatorFunction<T> {
  return input$ =>
    input$.pipe(
      tap(x => {
        if (predicate(x)) {
          fn(x);
        }
      })
    );
}

export function tapIfFalsy<T>(fn: (x: T) => void): MonoTypeOperatorFunction<T> {
  return tapIf<T>(x => !x, x => fn(x));
}

alors votre code peut devenir encore plus simple:

this.order = this.orderService.ordersLoaded.pipe(
      map((orders: OrderModel[]) => orders.find(order => order.orderName === this.name.toUpperCase()),
      tapIfFalsy(() => this.router.navigate(['/notFound']))
    ));
0
Andrei Mihalciuc 4 nov. 2019 à 13:18