Mengapa setelah mengklik tombol di komponen ion-alert, tampilan tidak mendapatkan pembaruan? Misalnya jika saya memiliki properti di komponen saya yang disebut mengirim dan penangan untuk tombol ion-alert saya :

  // in my component
  public sending = false;

 constructor(
    public alertCtrl: AlertController,
    ) { }

  async deleteFile() {
    const alert =  await this.alertCtrl.create({
      header: 'Deseas eliminar el archivo?',
      message: '',
      buttons: [
        {
          text: 'Eliminar',
          role: 'eliminar',
          cssClass: 'btn-alert',
          handler: () => {
            this.sending = true;
          }
        }
      ]
    });

     await alert.present();
  }

  <!-- in my view -->
<div> {{  sending  }}  </div>

Tampilan tidak diperbarui kecuali saya memanggil metode sudut ** markForCheck () ** di dalam handler.

Saya menggunakan ionic 4 dan angular.

Bahasa Inggris bukan bahasa pertama saya, jadi mohon maaf jika ada kesalahan

0
Sergio Romero 9 Desember 2019, 23:46

1 menjawab

Jawaban Terbaik

Di sini lihat komentar saya di dalam kode. Saya harap ini menjelaskan bahwa ini adalah perilaku yang diharapkan dan ada dua cara untuk memperbarui nilai properti "mengirim" (di dalam handler atau pengait onDidDismiss):

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

@Component({
  selector: 'app-home',
  templateUrl: 'home.page.html',
  styleUrls: ['home.page.css'],
})
export class HomePage {

  public sending = false;

 constructor(
    public alertCtrl: AlertController,
    ) { }

  async deleteFile() {
    const alert =  await this.alertCtrl.create({
      header: 'Deseas eliminar el archivo?',
      message: '',
      buttons: [
        {
          text: 'Eliminar',
          role: 'eliminar',
          cssClass: 'btn-alert',
          handler: () => {
            // this update of property "sending" happens in the "alert" component and the HomePage component does not learn about this change until next change detection cycle:
            this.sending = true;
          }
        }
      ]
    });
    await alert.present();
    alert.onDidDismiss().then(() => {
      // this update will happen after "alert" dismiss and within the scope of the HomePage component. 
      this.sending = true;
    });
  }
}

Untuk bermain-main: https://stackblitz.com/edit/ionic-4-template-psfsbd

1
Sergey Rudenko 10 Desember 2019, 02:55