Javascript 如何提供此功能';基于按钮的不同道具';点击事件?
我试图重用一个函数来打开Ionic 4中的一个模式。这两种方法虽然是分开的,但更愿意基于它们的独立参数组合起来,以更改出现的模态中的标题 这并不编译,但显示了我基本上想要实现的目标:Javascript 如何提供此功能';基于按钮的不同道具';点击事件?,javascript,angular,typescript,ionic-framework,components,Javascript,Angular,Typescript,Ionic Framework,Components,我试图重用一个函数来打开Ionic 4中的一个模式。这两种方法虽然是分开的,但更愿意基于它们的独立参数组合起来,以更改出现的模态中的标题 这并不编译,但显示了我基本上想要实现的目标: async openModal(edit, add) { const modal = await this.modalController.create({ component: ModalComponent, componentProps: { if
async openModal(edit, add) {
const modal = await this.modalController.create({
component: ModalComponent,
componentProps: {
if (edit) {
'title': 'Edit Firehouse'
else if (add) {
'title': 'Add Firehouse'
},
'firehouseShow': true
}
});
return await modal.present();
}
以下是当前存在的内容,即使出现错误也会编译:
“重复函数实现。”
这些函数通过角度按钮单击事件调用:
<ion-button (click)="openModal(edit)">Edit</ion-button>
<ion-button (click)="openModal(add)">Add</ion-button>
编辑
添加
我更愿意重用这个函数,尤其是因为它只在一个页面上被调用(一次)。但是,它会动态更改模式中显示的内容以及每次单击事件填充或未填充的数据。例如,“添加”单击事件将不会检索任何数据,但“编辑”将检索任何数据。第二个事件将不起作用,即使重复的函数问题已经解决,因为两个函数都执行相同的操作 考虑将
组件props
作为参数传递
异步OpenModel(componentProps){
const modal=等待this.modalController.create({
组件:ModalComponent,
组件支柱
});
return wait modal.present();
}
调用函数时:
openmodel({
“标题”:“编辑消防站”,
《消防秀》:真的吗
})
//或
开放式({
“标题”:“添加消防站”,
《消防秀》:真的吗
})
更新
如果希望仅获取标题作为参数,请在创建对象时设置标题
async openModal(title) {
const modal = await this.modalController.create({
component: ModalComponent,
componentProps : {
'title': title,
'firehouseShow': true
}
});
return await modal.present();
}
然后:
openmodel('Edit Firehouse')
//或
OpenModel(“添加消防站”)
要尝试的内容:标题:编辑编辑消防站“:“添加消防站”
?尝试此操作,都会导致“添加消防站”,如果两者都导致添加消防站,则Edit
永远不会true
那么您如何称呼它?角度按钮单击事件谢谢,这已经解决了。有没有办法用函数而不是调用来保存类似的道具?例如,“firehouseShow:True”如果我理解正确,可以通过在函数中生成对象来实现。我已经更新了帖子。
async openModal(title) {
const modal = await this.modalController.create({
component: ModalComponent,
componentProps : {
'title': title,
'firehouseShow': true
}
});
return await modal.present();
}