Attaching click to anchor tag in angular

Question

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</a>

I think you are not letting Angular work for you.

In angular 2:

1. Remove the href tag from <a> to prevent a page forwarding.
2. Then just add your usual Angular click attribute and function.
3. Add to style: "cursor: pointer" to make it act like a button

You just need to add !! before your click method handler call: (click)="!!onGoToPage2()". The !! will prevent the default action from happening by converting the return of your method to a boolean. If it's a void method, then this will become false.

<a href="#" (click)="onGoToPage2()">Go to page 2</a>