routerlink在angular2中不起作用

Question

我檢查了所有教程，但沒有發現我在做什么錯。

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
   ]
 })

請檢查上面的代碼，並請幫助我查找為什么routerlink無法正常工作。

Answer 1

不確定您粘貼的代碼是否正確訂購，但我會看到2個錯誤。

首先，您要設置routerlink屬性而不是routerLink ，請注意它區分大小寫。

其次，我很確定您不會在具有相關組件的模塊中導入RouterModule，請確保執行此操作，以便首先獲得對routerLink指令的訪問權。

Answer 2

您顯示的代碼是正確的。

我覺得你的問題是，你是不是進口RouterModule（這是組件聲明）到使用這個模板模塊。

在使用此模板聲明組件的模塊中添加：

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

然后將其添加到您的模塊導入中

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

Answer 3

帶有routerLink的錨標簽必須與de tag router-outlet位於同一位置