prevent running function on backtick angular-CodePudding

i have this syntax on angular(typescript), my problem is when this code runs, its automatically runs clickShowAttachments function, instead i am need to run function when this button clicks ...

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

and when it compiles, if i inspect page i see that : (click)="undefined" (https://i.stack.imgur.com/6kEin.png)

i tried replace double quote with single quote but nothing happens ..

CodePudding user response：

You are getting undefined because this.clickShowAttachments(data.attachments) returns undefined.

have you tried using

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

You can do this in angular2

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

CodePudding user response：

guys i fixed it that way

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