0

Hola muy buenas he implementado un popover en mi app de ionic, mi pregunta es una vez recibo los item con su valor al apretar cada botón como puedo hacer que según el botón que apriete ejecute una función como por ejemplo esta:

open_product(product_item){
this.api.selected_item=product_item;
const navData: NavigationExtras = {
  queryParams: {
    pagetype:'edit',
  }
};

this.router.navigate(['/edit-product'],navData);
 }

este código es como se ha creado el popover en el arcivo.ts donde lo quiero mostrar.

  async mostrarPop(evento){
    const popover = await this.popoverCtrl.create({
      component: PopoverComponent,
      event: evento,
      mode: 'ios',
      translucent: true,
      //backdropDismiss: true,
      cssClass: 'popover-class',
      
    });
    

    await popover.present();
    const {data} = await popover.onWillDismiss();
    console.log('padre', data);

  }

Aquí el html.

<ion-buttons slot="end">
                <ion-button (click)="mostrarPop( $event )">
                  <ion-icon slot="start" ios="ellipsis-horizontal" md="ellipsis-vertical"></ion-icon>
                </ion-button>
              </ion-buttons>

bueno esto lo tengo donde creo el compnente del popover y en components.ts tengo este código.

import { Component, OnInit } from '@angular/core';
import { PopoverController } from '@ionic/angular';

@Component({
  selector: 'app-popover',
  templateUrl: './popover.component.html',
  styleUrls: ['./popover.component.scss'],
})
export class PopoverComponent implements OnInit {

  items = Array(5);

  constructor(private popoverCtrl: PopoverController) { }

  ngOnInit() {}

  onClick( valor: number ){
    console.log('item:',valor);
    this.popoverCtrl.dismiss({
      item: valor
    });
  }

}

Aquí en el archivo Html.

  <ion-item *ngFor="let item of items; let i = index;" (click)="onClick( i + 1 )" detail>
    <ion-label>Item {{ i + 1}}</ion-label>
  </ion-item>
  <ion-item (click)="onClick()">
  <ion-label>Borrar</ion-label>
  </ion-item>
</ion-list>

gracias.ahora mismo cuando se abre el popover se imprime por consola el numero del botón que aprietas es decir botón 1 se imprime item 1 y así sucesivamente.

1 respuesta 1

0

hola he conseguido hacer esto, pero no consigo pasar el parámetro product_item para poder ejecutarlo como en la función open_product este es el código si alguien consigue echar una mirada lo agradecería

async mostrarPop(evento: any){
const popover = await this.popoverCtrl.create({
  component: PopoverComponent,
  event: evento,
  mode: 'ios',
  translucent: true,
  //backdropDismiss: true,
  cssClass: 'popover-class',
  
});


await popover.present();
const data = await popover.onWillDismiss().then((data) => {
console.log(data);

    if (data && data.data) {
      console.log(data.data);

      
      var item = data.data.item;
   
      if (item == '1') {
       
         const navData: NavigationExtras = {
           queryParams: {
             pagetype:'edit',
            }
         };
      
          this.router.navigate(['/edit-product'],navData);
       
      } else if (item == '2') {
        this.router.navigate(['app/profile']);

      }

    }
  });
 }

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.