模态表单关闭时的回调答案

【问题标题】：Callback when a modal form closes模态表单关闭时的回调
【发布时间】：2018-04-03 06:14:37
【问题描述】：

在 ionic2 (v 2.1.7) 中关闭模态表单后如何调用方法？以下是我的工作流程

用户加载页面（页面 A）
然后点击一个按钮打开一个模态表单（页面 B）
添加一些细节（这将更新服务）
关闭模态表单（B 页）
现在我想向页面 A 添加一个回调并从中读取新值服务

这就是我所做的

#page A
let modal = this.modalCtrl.create(NewListPage);
modal.present();
getValueFromService() 

#page B
updateService()
this.viewCtrl.dismiss();

目前发生的情况是，一旦程序点击modal.present();，它不会等待Page B关闭，然后再转到getValueFromService()，因此，一旦我关闭模式，新更新的值就无法读取形式。

【问题讨论】：

标签： angular typescript ionic2

【解决方案1】：

您可以像这样使用onDidDismiss (doc)：

 // Page A
 presentModal() {
   let modal = this.modalCtrl.create(NewListPage);

   modal.onDidDismiss(() => {
     // This is going to be executed when the modal is closed, so
     // you can read the value from the service here
     getValueFromService();
   });

   modal.present();
 }

然后就像你说的

// Page B
updateService();
this.viewCtrl.dismiss();

还请注意，您可以在Page A 和Page B 之间发送数据，所以也许您甚至可以避免使用服务（如果您这样做只是为了来回发送数据）而只是发送数据如下：

 // Page A
 presentModal() {
   let modal = this.modalCtrl.create(NewListPage);

   modal.onDidDismiss(dataFromModal => {
     // You can use the data here
     console.log(dataFromModal.foo);
   });

   modal.present();
 }

在页面 B

// Page B
// Instead of calling the service, you can send the data to the caller
let data = { 'foo': 'bar' };
this.viewCtrl.dismiss(data);

【讨论】：

很高兴听到这个消息:)