How show only links to modules that I can active in Angular?

Question

I use router and guards with CanActivate. It works fine, but I need show only in my menu the "activable" links.

Has router any option as "isActivable"?

Example:

<ul>
 <li routerLink="home" routerLinkActive="active" *ngIf="isActivable">Home</li>
<ul>

Take a look here https://stackoverflow.com/questions/40507064/how-to-hide-link-by-guard-angular2 — Spitzbueb, Jun 06 '17 at 11:35
But these solution add a lot of boilerplate, I need add the guard in the menu and in the routing module... — MiguelAngel_LV, Jun 06 '17 at 11:37

score 0 · Answer 1 · answered Jun 06 '17 at 11:53

You can just inject your Guard in the constructor of your Component. Like this:

constructor(private yourGuard: YourGuard){}

And int the Template:

<ul>
 <li routerLink="home" routerLinkActive="active" *ngIf="yourGuard.canActivate()">Home</li>
<ul>

Of course you have to specify your guard in the Router...

1 Answers1