Templating with href in angular (4)

Question

So I know that in Angular 2 we can simply substitute ng-href for href in order to make templated urls work, but it doesn't work for me in Angular 4. I can't find any documentation for it on angular.io either, so how does it work?

Edit: Maybe I have the version #s confused. I'm concerned with the latest Angular (angular.io)

I want to link to external stylesheets, like link rel="stylesheet" href="...">

where ... is {{link}}, link = https://www.w3schools.com/w3css/4/w3.css

Answer 1

AngularJS required that you use ng-href because there were issues with binding expressions to some types of DOM elements and attributes.

This problem doesn't exist in Angular now.

The following will work as expected:

<a href="{{your expression here}}"></a> 

You can also bind using the attr prefix like this:

<a [attr.href]="your expression here"></a> 

As others have mentioned. If you are using routing and want to add a href attribute to a specific route. Use the routerLink directive as it will add the href attribute to <a> tags.