0

Em uma de minhas páginas, quando o usuário clica no botão Deletar é exibido um alert solicitando confirmação. Essa ação existe em mais de uma página, para evitar duplicar código, como posso reutilizar o método abaixo? Devo mover para algum local, fazer algum tipo de include?

showConfirm(slidingItem: ItemSliding) {
    const confirm = this.alertCtrl.create({
      title: 'Deletar tarefa!',
      message: '<strong>Atenção</strong>: Essa ação não tem como ser desfeita.',
      buttons: [
        {
          text: 'Cancelar',
          handler: () => {
            slidingItem.close();
          }
        },
        {
          text: 'Deletar',
          handler: () => {
            slidingItem.close();
          }
        }
      ]
    });
    confirm.present();
  }

Este código é executado ao clicar no elemento:

<button ion-button color="danger">
   <ion-icon name="delete"></ion-icon>
   Deletar
</button>

1 Resposta 1

0

Consegui resolver parte do que eu queria com este component:

import { Component } from '@angular/core';
import { AlertController, ItemSliding } from 'ionic-angular';

@Component({})
export class ConfirmTaskDeletionComponent {

  constructor(public alertCtrl: AlertController) {}

  showConfirm(slidingItem: ItemSliding) {
    const confirm = this.alertCtrl.create({
      title: 'Deletar tarefa!',
      message: '<strong>Atenção</strong>: Essa ação não tem como ser desfeita.',
      buttons: [
        {
          text: 'Cancelar',
          role: 'cancel',
          handler: () => {
            slidingItem.close();
          }
        },
        {
          text: 'Deletar',
          handler: () => {
            slidingItem.close();
          }
        }
      ]
    });

    confirm.present();
  }

}

E o chamo assim:

showConfirm(slidingItem: ItemSliding) {
  this.dialog.showConfirm(slidingItem);
}

Já no meu HTML (página principal) tenho:

<button ion-button color="danger" (click)="showConfirm(slidingItem)">
  <ion-icon name="delete"></ion-icon>
  Deletar
</button>

Meu desafio agora é mover este botão para o html do component, porém, o trecho (click)="showConfirm(slidingItem)" está complicando minha vida, sempre que o movo para de funcionar.

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .