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! Commented el 15 may. 2019 a las 18:07
  • No hay de qué. Si te sirvió la respuesta márcala como correcta porfi ;) Commented el 16 may. 2019 a las 9:09

Tu Respuesta

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

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