属性 'onDidDismiss' 在 ionic 4 和 Angular 类型上不存在

Question

我正在开发一个应用程序，我在 TypeScript 中有下一个 class。

我想在“ModalController”关闭模态时尝试在回调类型的方法中获取数据：

import { Component, OnInit } from '@angular/core'; 
import {NavController, ModalController} from '@ionic/angular'; 
import { Router } from '@angular/router'; 
import { HomePage } from '../home/home.page'; 
import {AddItemPage} from '../add-item/add-item.page';

@Component({   
  selector: 'app-todo',   
  templateUrl: './todo.component.html',   
  styleUrls: ['./todo.component.scss']
})

export class TodoComponent implements OnInit {

  public items;

  constructor(public navCtrl: NavController, public modalCtrl: ModalController) {
    this.ionViewDidLoad();    
  }

  ngOnInit() {}

  async addItem()  {
    // Create a modal using MyModalComponent with some initial data 
     const modal = await this.modalCtrl.create({   
        component: AddItemPage,  componentProps: {
           'prop1': "cadena!!!!!!!"   
        } 
     }).then(function(modal) {   
        return modal.present(); 
     });

     modal.onDidDismiss(() => {
        // Call the method to do whatever in your home.ts
        console.log('Modal closed');
    });
  }
}

我收到这个错误：

core.js:15724 ERROR Error: Uncaught (in promise): TypeError: Cannot read property 'onDidDismiss' of undefinedTypeError: Cannot read property 'onDidDismiss' of undefine

Answer 1

由于您正在使用 await 创建模态，因此您不需要像那样使用 then。

请尝试以下操作：

async addItem()  {

  // Create the modal
  const modal = await this.modalCtrl.create({   
    component: AddItemPage,
    componentProps: {
      'prop1': "cadena!!!!!!!"   
    } 
  });

  // Present the modal
  return await modal.present();

  // Wait for the modal to be dismissed before continuing...
  const eventDetails = await modal.onDidDismiss();

  if (eventDetails) {
    console.log(eventDetails.data);
  }

  // ...

}

上面的代码假定您在关闭模态时返回了一些东西，如下所示：

// Dismiss the modal returning some data object
modalController.dismiss({
  'result': 'This is the result returned by the modal!'
});

Answer 2

尝试：

const modal = await modalController.create({...});
const { data } = await modal.onDidDismiss();
console.log(data);

根据官方 documentation 。

Answer 3

这个post有什么关系：https://medium.com/@david.dalbusco/how-to-declare-and-use-modals-in-ionic-v4-4d3f42ac30a3 我的错误只是我如何创建模态。我已经按照这段代码创建了我的模态属性.

async openModal() {
    const modal: HTMLIonModalElement =
       await this.modalController.create({
          component: DatePickerModal,
          componentProps: {
             aParameter: true,
             otherParameter: new Date()
          }
    });

    modal.onDidDismiss().then((detail: OverlayEventDetail) => {
       if (detail !== null) {
         console.log('The result:', detail.data);
       }
    });

    await modal.present();
}

属性 'onDidDismiss' 在 ionic 4 和 Angular 类型上不存在

Property 'onDidDismiss' does not exist on type ionic 4 and Angular

typescript

ionic-framework

angular

ionic4