我的Angular应用程序创建一个模态对话框,允许用户输入和更改某些属性。当用户试图取消模态时,请警告用户模型中未保存的更改(单击X,或在模态外部单击)。
const modal = this.modalService.create({
nzTitle: title,
nzContent: MyModalComponent,
nzComponentParams: {
// component parameters
},
nzFooter: null,
nzOnCancel: (result) => {
if (result changed) {
return;
} else {
return new Promise((resolve, reject) => {
this.modalService.confirm({
nzTitle: `If you leave, your unsaved changes will be lost. Do you want to leave?`,
nzOkText: 'Yes',
nzOkType: 'danger',
nzOnOk: () => resolve(true),
nzCancelText: 'No',
nzOnCancel: () => resolve(false),
});
}).catch(() => console.log('cancel'))
}
}
});
在上面的代码中,“结果”不反映模态中的更改,因此不起作用。
实现它的最佳方法是什么?
答案 0 :(得分:0)
答案 1 :(得分:0)
当nzOnCancel
是Component时,nzContent
可以接受Component实例作为函数参数,此函数返回一个promise
,当执行完成或promise结束时,它将自动关闭(返回false
以防止关闭)。
您可以在此处查看在线示例: