Ionic 4 - 从 Modal 传回数据 [英] Ionic 4 - Pass Data BACK from Modal
问题描述
我正在尝试创建一个模态窗口,将一组对象传递给它,让用户从该数组中选择一个对象,然后让我的模态窗口将他们选择的对象传回.
I'm trying to create a modal window, pass it an array of objects, have a user select one object from that array, and then have my modal pass back the object they've selected.
我尝试使用 modalName.onDidDismiss(data=> ...) 如此处所述,但显然 Ionic 4 更改了onDidDismiss"以不接受任何传回给它的值.
I've tried using the Ionic 2 approach of modalName.onDidDismiss(data=> …) as explained here, but apparently Ionic 4 changed "onDidDismiss" to not accept any values passed back to it.
所以我不知道如何将数据从我的模态窗口发送回调用它的页面.
So I'm at a loss for how to send data from my Modal window back to the page that called it.
推荐答案
几天前我遇到了同样的问题,这是我的解决方案:
Some days ago I had the same problem and here's my solution:
我想,您已经有一个包含实际模态的组件.名称 UserModalComponent
I guess, you already have a component which contains the actual modal. name UserModalComponent
您的 UserModalComponent
应该注入 ModalController:
Your UserModalComponent
should get the ModalController injected:
constructor(private modalController: ModalController){}
下一步是将选定的用户传回:
Next step is to pass the selected user back:
selectUser(user: User):void {
this.modalController.dismiss(user);
}
在您想要调用模态并让用户返回的组件中,您还必须注入 ModalController
如上所述,此外,您需要此方法:
In your component in which you want to call the modal and get the user back, you also have to inject the ModalController
as above and additionally, you need this method:
async openUserModal() {
const modal = await this.modalCtrl.create({
component: UserModalComponent,
componentProps: { users: this.users },
});
modal.onDidDismiss()
.then((data) => {
const user = data['data']; // Here's your selected user!
});
return await modal.present();
}
我希望这会有所帮助!如果有什么不清楚的,尽管问!
I hope this helps! If anything is unclear, just ask!
这篇关于Ionic 4 - 从 Modal 传回数据的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!