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?

o inicia sesi贸n.

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';
  });