如何解决渲染后超链接的点击功能不可用
我做了一些字符串操作,想创建一个如下所示的字符串。 [sample] 和 [express] 是超链接。
<a>
元素应该具有 click
函数并且它应该调用 searchFromURL()
。
但是一旦呈现,click
函数就无法使用,这背后的原因可能是什么?
或者有其他方法可以做到这一点吗?
home.page.html<ion-row innerHTML="{{buildNavigationSearchElement(dicDat.translation)}}"></ion-row>
home.page.ts
buildNavigationSearchElement(elementText: String){
let retElem = elementText + '<a href="#" (click)="searchFromURL();">Search Text</a>';
return retElem;
}
有没有最安全的方法用 click
函数构建这个元素?
解决方法
最后我想出了这个解决方案。如下生成超链接。
home.page.html
<div [innerHTML]="buildNavigationSearchElement()"></div>
home.page.ts
buildNavigationSearchElement(){
let myText = This is a + '<a class="myhyperlink_1">sample</a>' + text to + '<a class="myhyperlink_2">express</a>' + my issue.
return myText;
}
在 ngAfterViewChecked()
事件中,每个超链接都绑定到一个类方法。
ngAfterViewChecked() {
var myElements =
this.elementRef.nativeElement.querySelectorAll('[class^="myhyperlink"]');
var i: number;
for (i = 0; i < myElements.length; i++) {
myElements[i].addEventListener('click',this.openAlert.bind(this));
}
}
属性数组存储在类中,其中包含每个超链接的操作和参数。
openAlert(parameter: any) {
let className = parameter.srcElement.className;
//do what ever required
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。