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?

score 11 · Accepted Answer · edited May 27 '16 at 06:27

11

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.

edited May 27 '16 at 06:27

Günter Zöchbauer

623,577
216
2,003
1,567

answered May 26 '16 at 01:36

Koronos

547
4
16

7

No need to add the comment about your bad English everywhere. It's definitely good enough. – Günter Zöchbauer May 27 '16 at 06:29

Use routerlink or href based on condition

1 Answers1