我如何onclick / (click)在模板文字中系結函式。
例如:
for (let i = 0; i < locations.length; i ) {
let customHtml = `
<div >
<ion-button size="small" (click)="${abc(locations[i])}">Message</ion-button>
<ion-button size="small" onclick="abc('${locations[i]}')">Request</ion-button>
</div>
`;
}
abc(l){
console.log(l);
}
在第一個按鈕上是在加載時記錄。不是點擊。
在第二個按鈕上顯示錯誤:Uncaught ReferenceError: abc is not defined。
我已經嘗試過兩種方式 vanilla Javascript 和 Angular 方式來系結點擊事件上的函式。
uj5u.com熱心網友回復:
在@Reyno 評論的幫助下管理它創建動態元素。通過使用 Angular 的Renderer2.
for (let i = 0; i < locations.length; i ) {
let customHtml = this.addCustomHtml(locations[i]);
// can use it here it is working now.
}
addCustomHtml(l) {
const p1 = this.renderer.createElement('p');
const p1Text = this.renderer.createText(`ID: ${l[0]}`);
this.renderer.appendChild(p1, p1Text);
const p2 = this.renderer.createElement('p');
const p2Text = this.renderer.createText(`Lat: ${l[1]} \n Lng: ${l[2]}`);
this.renderer.appendChild(p2, p2Text);
const button = this.renderer.createElement('ion-button');
const buttonText = this.renderer.createText('Send Request');
button.size = 'small';
button.fill = 'outline';
button.onclick = function () {
console.log(l);
};
this.renderer.appendChild(button, buttonText);
const container = this.renderer.createElement('div');
this.renderer.appendChild(container, p1);
this.renderer.appendChild(container, p2);
this.renderer.appendChild(container, button);
return container;
}
轉載請註明出處,本文鏈接:https://www.uj5u.com/ruanti/479967.html
標籤:javascript 有角度的 打字稿 离子框架 模板文字
上一篇:我無法在我的反應式表單上訪問FormBuilder的group屬性
下一篇:Unity:cvc-complex-type.2.4.a:發現以元素“base-extension”開頭的無效內容。應為“{layoutlib}”之一
