防止在反引号角度上运行功能

Question

我在 angular(typescript) 上有这种语法，我的问题是当这段代码运行时，它会自动运行 clickShowAttachments 函数，而我需要在单击此按钮时运行函数......

${data.attachments ? `<button (click)="${this.clickShowAttachments(data.attachments)}">show attachments</button>` : ''}

当它编译时，如果我检查页面，我会看到：(click)="undefined" ( https://i.stack.imgur.com/6kEin.png )

我尝试用单引号替换双引号但没有任何反应..

Answer 1

您变得未定义，因为this.clickShowAttachments(data.attachments)返回未定义。

你试过用吗

${data.attachments ? `<button (click)="this.clickShowAttachments(data.attachments)">show attachments</button>` : ''}

你可以在 angular2+ 中做到这一点

<button *ngIf="data?.attachments" (click)="this.clickShowAttachments(data.attachments)">show attachments</button>

Answer 2

伙计们，我就这样修好了

const a = `<button id="btn1">btn text</button>`;
document.getElementById("btn1").addEventListener('click', ()=> this.clickShowAttachments(data.attachments));