No tienes acceso a esta clase

¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera

Transformar peticiones

14/23
Recursos

Aportes 9

Preguntas 5

Ordenar por:

¿Quieres ver más aportes, preguntas y respuestas de la comunidad?

Si no les sale el el valor en su html… prueben pondiendo el codigo en el metodo getProductsByPage

Hay un error en esta clase en la parte de product?.taxes
lo que hace el ? en product? es validar si el objeto product existe, entonces usa la propiedad .taxes, por tanto product?.taxes no va a generar ningun error.

Lo ideal seria usar el ?? de la siguiente forma: product.taxes ?? '' es decir, si la propiedad es null o undefined coloca un string vacio.

en que momeno se puede usar el ??

Siguiendo este curso una opcion podria ser las imagenes. Si product.images viene null o undefined ahi si aplica y querdaria asi: product.images?.length

recordar que en el componente products, en oninit cargamos los productos por medio del servicio getProductsByPage, por ende es en este servicio es donde debemos usar el map dentro del pipe para que este agregue el elemento taxes que en los productos queremos visualizar. ( el pipe en getAllProducts ya no se usa a este punto).

RxJS map() operator is a transformation operator used to transform the items emitted by an Observable by applying a function to each item.
Documentación

A veces puede ser necesario hacer transformaciones a la respuesta de una petición, para poner ejemplo agregar datos para complementar la información que entrega el backend.

RXJS .map() → Es un operador que permite tomar cada uno de los valores que lleguen en el observable y aplicarles una transformación.

// Obtener los productos desde la API
  getProducts(limit?: number, offset?: number) {
    ...
    return this.http.get<Product[]>(this.apiUrl, { params })
    .pipe(
      map(products => products.map(item => {
        return {
          ...item,
          taxes: .19 * item.price
        }
      }))
    )
  }
  • products → Agrupa la respuesta del observable, esta es un array. Luego se usa un map nativo para agregar el atributo taxes a cada objeto dentro de products.

Luego en la vista del componente se podría renderizar esta propiedad:

<p>Valor IVA: {{ product?.taxes | currency }}</p>
  • El operador de optional chaining (?) permite que la propiedad solo se muestra si su valor no es nulo.

Creo que vi esta misma notacion cuando comence a trabajar y al fin puedo decir que la entiendo bien

El operador RxJS map() es un operador de transformación que se utiliza para transformar los elementos emitidos por un Observable aplicando una función a cada elemento.

    Swal.fire({
      title: 'Lo siento',
      text: 'El producto ' + errorMsg,
      icon: 'error',
      confirmButtonText: 'OK'
    });
    console.log(errorMsg);
    this.statusDetail = 'error';
  });