Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Angular2 - Disable RouterLink

Tags:

I want a better way to write these lines of code.

<li *ngIf="params.page > 1" class="page-item">
    <a class="page-link" [routerLink]="[]" [queryParams]="changePage(params,1)">First</a>
 </li>
<li *ngIf="!(params.page > 1)" class="page-item disabled">
     <a class="page-link">First</a>
</li>

I want to disable routerLink when !(params.page > 1). The class "disabled" is the easy way (ngClass). But the routerLink will be still active

like image 416
Michalis Avatar asked Apr 28 '17 04:04

Michalis


1 Answers

Try something like this

<li class="page-item">
<a class="page-link" [class.disabled]="(params.page > 1) ? true : null" 
    [routerLink]="[]" [queryParams]="changePage(params,1)">First</a>
</li>

Edit

I missed this part. :D

You also need to add class

 a.disabled {
     pointer-events: none;
     cursor:default;
 }

Try this and check whether it works or not.

like image 53
The Hungry Dictator Avatar answered Sep 24 '22 11:09

The Hungry Dictator