Set href in attribute directive in Angular

There is no need to prefix with #

In this code

<ul class="nav nav-tabs" role="tablist">
  <li *ngFor="let aType of resourceTypes; let i = index"
      [ngClass]="{'active': i == 0}"
      role="presentation">
    <a [attr.href]="aType.Name"
       [attr.aria-controls]="aType.Name"
       role="tab"
       data-toggle="tab">
      {{aType.Name}}
    </a>
  </li>

aType already refers to the *ngFor variable.

If you want to prefix a literal # you can use

[attr.href]="'#' + aType.Name" 

There is also no need for attr. if the element actually has the property href which is the case with <a>.

Well you can bind it with string interpolation:

href = "#{{aType.Name}}" 

(Note that the attribute used here is href, not [attr.href].)