2

In my application I am using routerLink to create my link as per according to parameter passed in routerLink.

<a [routerLink]="['/home/global/userprofile',UserId]">

Above code generate links with the userId provided, but I want to customize angular routerLink so that I can check if UserId is valid or not, if valid I will return the converted href link throught this and if not I will return blank or null url.

I can not use any other directive approach or pipe factories as I am using this routerLink code in several places in my project so I just not want to go and change each and every where that code is writtern. Can anyone guide me in this? I just need concept, I can write code for the idea.

If required, I can explain it more if any queries for this.

ankit sharma
  • 449
  • 1
  • 6
  • 17

1 Answers1

3

Instead of using routerLink directive, I suggest You to use a programmatical redirection in your component class, like this:

HTML component file

<a (click)="goToUserProfile(UserId)">Some link</a>

TS Component class:

import { Router } from '@angular/router';

constructor(private router: Router) {}

goToUserProfile(userId: number) {
    if (/* userId verification*/) {
        this.router.navigate(['/home/global/userprofile', userId]);
    }
    // do nothing
}

Otherwise, you can use a router guard, here are some useful links:

Hope it helps.

Laiso
  • 2,630
  • 3
  • 16
  • 32