如何在angular中绑定自定义函数到swalhtml ?

Question

我使用swal在我的角项目，我需要调用测试()函数从绑定到swal的html当按钮点击，但不工作?

Swal.fire({
html: `<button (click)="test()">Test</button>`,
icon: 'warning',
showCancelButton: true,
confirmButtonText: this.translateService.instant('Common.Yes'),
cancelButtonText: this.translateService.instant('Common.Cancel'),
confirmButtonColor: '#00d68f',
cancelButtonColor: '#8f9bb3',
});

Answer 1

像这样修改你的代码:

Swal.fire({
html: `<button id="test">Test</button>`,
icon: 'warning',
showCancelButton: true,
confirmButtonText: this.translateService.instant('Common.Yes'),
cancelButtonText: this.translateService.instant('Common.Cancel'),
confirmButtonColor: '#00d68f',
cancelButtonColor: '#8f9bb3',
didOpen: () => {
const b = (Swal.getHtmlContainer() as any).querySelector('#test')
b.addEventListener("click", ()=>{
this.test();
});
},
});