In the learning curve of Angular2 router features, I ran into a bug that left my head scratching. Trying to render a routerLink would not create the necessary href url. As in:
<a routerLink=”app/people-search” routerLinkActive=”active”><i class=”fa fa-search fa-fw” aria-hidden=”true”></i>People Search</a>
would render to:
<a _ngcontent-rxo-12=”” routerlink=”app/people-search” routerlinkactive=”active”><i _ngcontent-rxo-12=”” aria-hidden=”true” class=”fa fa-search fa-fw”></i>People Search</a>
As you can see, no href rendered, just the routerLink and routerLinkActive directives rendering as all lowercase attributes. Weird.
Well not so if I had actually picked up this line from the documentation:
RouterLink,RouterLinkActiveandRouterOutletare directives provided by the AngularRouterModulepackage. They are readily available for us to use in our template.
Duh.
I added the
import { RouterModule } from ‘@angular/router’;
statement to my module definition file and I was back in business.
Basics.