Aufrufen von Funktionen in dynamischen HTML-Strings
P粉132730839
P粉132730839 2023-08-17 10:33:17
0
1
466

Ich habe eine Struktur in meiner Anwendung, in der ich dynamisches HTML erzeuge. Ich füge jeder Benutzeraktion, die über eine Schaltfläche verfügt, ein HTML-Mitglied hinzu. Ich möchte der (Onclick-)Aktion dieser Schaltflächen meine definierte Funktion zuweisen. Wenn ich jedoch auf die Schaltfläche in der HTML-Zeichenfolge klicke, die ich spontan erzeuge, erhalte ich die Fehlermeldung, dass die entsprechende Funktion nicht definiert ist. was mache ich? Meine Funktion;

returnButtonGroup(key: string):string{ return '' } testFunc(key:string){ console.log(key); }

Ich habe das i-Tag hinzugefügt, indem ich innerHtml in jeder Aktion des Benutzers verwendet habe. Irgendwelche Vorschläge, was ich tun kann? Danke.

P粉132730839
P粉132730839

Antworte allen (1)
P粉551084295

考虑绑定的函数的作用域和上下文是很重要的。

在你的情况下,testFunc函数是在你的Angular组件中定义的,但是它是从生成的HTML字符串中的内联onclick属性中调用的。这可能会导致作用域和上下文问题。

为了在Angular中正确地绑定动态生成的HTML中的事件和函数,你应该使用Angular的事件绑定机制。

将你的returnButtonGroup函数更新为返回Angular模板代码而不是原始的HTML字符串。使用Angular的(click)事件绑定来绑定testFunc函数。

returnButtonGroup(key: string): string { return ``; }

在HTML中使用

在你的component.ts中,创建一个属性来保存动态生成的HTML,并确保testFunc函数在组件内可访问。

dynamicHtml: string; constructor() { this.dynamicHtml = this.returnButtonGroup('someKey'); // 使用适当的键调用你的方法 } testFunc(key: string) { console.log(key); }
    Neueste Downloads
    Mehr>
    Web-Effekte
    Quellcode der Website
    Website-Materialien
    Frontend-Vorlage
    Über uns Haftungsausschluss Sitemap
    Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!