将点击附加到角形锚标签 [英] Attaching click to anchor tag in angular

问题描述

我试图将click事件附加到锚定标记(来自ajax)并阻止默认重定向.我该怎么做呢?

I am trying to attach click event to anchor tags (coming from ajax) and block the default redirection. How can I do it in angular ?

<ul>
    <li><a href="/abc"><p>abc</p></a></li>
    <li><a href="/abc1"><p>abc1</p></a></li>
    <li><a href="/abc2"><p>abc2</p></a></li>
    <li><a href="/abc3"><p>abc3</p></a></li>
</ul>

在ts文件中:

constructor(elementRef: ElementRef, renderer: Renderer) { 
    this.listenFunc = renderer.listen(elementRef.nativeElement, 'click', (event) => {
        event.preventDefault();
        let target = event.target || event.srcElement || event.currentTarget;
        console.log(target);
    });  
}

这会将事件附加到所有元素，如何将其限制为仅锚标记?

This will attach event to all elements, how can I limit this to anchor tag only ?

所有帮助表示赞赏.

推荐答案

您可以使用 routerLink (对于角度2+，它是href的替代选择)具有如下所示的click事件，以防止重新加载页面

You can use routerLink (which is an alternative of href for angular 2+) with click event as below to prevent from page reloading

<a [routerLink]="" (click)="onGoToPage2()">Go to page 2</a>

这篇关于将点击附加到角形锚标签的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！