0

Necesito tomar el product.value de cada item, sumarlos, y pasarlo a otro componente.

Intente con navigate.params y no estoy encontrando la forma, muchas gracias por cualquier consejo o ayuda!

Mi product-list.html

<app-header titulo="Productos"></app-header>
<ion-content>
  <ion-searchbar placeholder="Buscar turno disponible" (ionChange)="onSearch($event)" animated></ion-searchbar>
  <ion-list>
    <ion-item lines="full" *ngFor="let product of products | filter: textoBuscar: 'description'"
      [routerLink]="['/product', product.id]">
      <ion-avatar slot="start">
        <img src="../../../assets/gulf.png">
      </ion-avatar>
      <ion-label>{{ product.description }}</ion-label>
      <ion-label text-right>{{ product.stock }} litros</ion-label>
    </ion-item>
  </ion-list>
</ion-content>

Mi product-list.ts

export class ProductListPage implements OnInit {
  products: ProductI[];
  textoBuscar = ''
  productId: null;
  constructor(
    private productService: ProductService,
    private loadingCtrl: LoadingController,
    ) { }
  ngOnInit() {
    this.loadProducts();
  }
  async loadProducts() {
    const loading = await this.loadingCtrl.create({
      message: 'Cargando'
    });
    await loading.present();
    this.productService.getProducts().subscribe(res => {
      loading.dismiss();
      this.products = res;
    });
  }

1 respuesta 1

2

La mejor forma de pasar valores entre componentes es usar un servicio que los almacene. En tu caso tienes el servicio ProductService, si le declaras una variable por ejemplo: sumatorio, puedes usarlo para almacenar la suma de los values y tenerla en el otro componente.

export class ProductService {
   private sumatorio:number;

   public setSumatorio(valor:number){
     this.sumatorio = valor;
   }
   public getSumatorio(){
     return this.sumatorio;
   }
...

Solo tienes que establecer el valor en el componente adecuado y obtenerlo en el otro:

export class ProductListPage implements OnInit {
  products: ProductI[];
  textoBuscar = ''
  productId: null;
  constructor(
    private productService: ProductService,
    private loadingCtrl: LoadingController,
    ) { }
  ngOnInit() {
    this.loadProducts();
  }
  async loadProducts() {
    const loading = await this.loadingCtrl.create({
      message: 'Cargando'
    });
    await loading.present();
    this.productService.getProducts().subscribe(res => {
      loading.dismiss();
      this.products = res;
      let sumatorio:number=0
      this.products.forEach(product=>{
         sumatorio+=product.value;
      })
      this.productService.setSumatorio(sumatorio);
    });
  }

export class otroComponente implements OnInt {
   private sumatorio:number;
   constructor(
     private productService: ProductService,
     private loadingCtrl: LoadingController,
   ) { }
   ngOnInit() {
     this.sumatorio = this.productService.getSumatorio();
   }
}

2
  • Funciona muy bien para mostrar el valor total! Muchas gracias! el 15 may. 2019 a las 18:07
  • No hay de qué. Si te sirvió la respuesta márcala como correcta porfi ;) el 16 may. 2019 a las 9:09

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.