Use routerlink or href based on condition

Question

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?

Answer 1

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.