angularangular2-routingangular2-router

Use routerlink or href based on condition


I have this piece of code in a component

<a *ngFor="let item of config.socialLinks" [routerLink]="[item.url]">
...
</a>

This works as expected when is using local routes that are defined in the app.component but when external routes it redirects to http:localhost:5555 | http://external.com Is there a way to use routerLink for local routes and href for external routes?


Solution

  • That is because, the directive [routerLink] is only for internal route system, and external links should be declarated in the href like this:

    <a *ngFor="let item of config.socialLinks" href="{{item.url}}"></a>
    

    Enjoy.