routerlink not working in angular2

Question

I have checked all the tutorial and didn't find, what i am doing wrong.

AppModule :

 import { BrowserModule } from '@angular/platform-browser';
 import { NgModule } from '@angular/core';
 import { FormsModule } from '@angular/forms';
 import { HttpModule } from '@angular/http';

 import { AppComponent } from './app.component';
 import {BlogComponent} from './blog/blog.component';
 import { PortfolioComponent } from './portfolio/portfolio.component';
 import { NavbarComponent } from './shared/navbar/navbar.component';
 import {TimelineComponent} from './timeline/timeline.component';
 import {HomeComponent} from './home/home.component';

 import { routing} from './app.routing';

 @NgModule({
   declarations: [
     AppComponent,
     PortfolioComponent,
     NavbarComponent,
     BlogComponent,
     TimelineComponent,
     HomeComponent
   ],
   imports: [
     BrowserModule,
     FormsModule,
     HttpModule,
     routing
   ],
   providers: [],
   bootstrap: [
     AppComponent
   ]
 })
 export class AppModule { }
 </i>

 Navigation Bar 
 <i>
 <div id="navbar" class="collapse navbar-collapse">
       <ul class="nav navbar-nav">
         <li><a routerlink="/portfolio">Portfolio</a></li>
         <li><a routerlink="/timeline">Timeline</a></li>
         <li><a routerlink="/blog">Blog</a></li>
       </ul>
       <ul class="nav navbar-nav navbar-right">
         <li><a href="#contact">Professionals</a></li>
         <li><a href="#contact">Students</a></li>
       </ul>
     </div>
 </i>

 NGModule :
 <i>
 import { BrowserModule } from '@angular/platform-browser';
 import { NgModule } from '@angular/core';
 import { FormsModule } from '@angular/forms';
 i

 import { routing} from './app.routing';

 @NgModule({

   imports: [
     BrowserModule,
     FormsModule,
     HttpModule,
     routing
   ],
   providers: [],
   bootstrap: [
     AppComponent
   ]
 })

Please check above code, anf please help me to find why routerlink is not wokring.

Answer 1

Not sure the code you pasted is ordered correctly but I can see 2 mistakes.

First, you're setting the routerlink attribute instead of routerLink , notice it's case sensitive.

Second, I'm pretty sure you don't import RouterModule in the module with the relevant component, make sure you do that so you get access to the routerLink directive in the first place.

Answer 2

The code you are showing is correct.

I think that your problem is that you are not importing RouterModule (which is where component is declared) into the module which uses this template.

in the module that declares the component with this template add:

import { RouterModule } from '@angular/router';

then add it to your modules imports eg

@NgModule({
  imports: [
    RouterModule
  ],
  declarations: [MyComponent]
})
export class MyTemplatesModule { }

Answer 3

带有routerLink的锚标签必须与de tag router-outlet位于同一位置