添加路由器後未加載AngularJS2組件

Question

添加路由器後未加載AngularJS2應用組件。日誌中沒有錯誤。如果我刪除路由器，它會重新開始工作。有沒有人遇到過這種問題。我正在使用'lite-server'來運行應用程序。

角JS版本： 「2.4.0」，
路由器版本： 「3.4.8〜」，
精簡版，服務器版： 「^ 2.2.2」，

這是怎麼了我添加路由器到我的應用程序。

步驟1：添加 '<base href="/">' 來的index.html

步驟2：加入路由器鏈接到我的component.html

<nav> 
    <a routerLink="/new">Contacts</a> 
    </nav> 
    <router-outlet></router-outlet> 

步驟3：我的router.ts看起來像下面

export const routes: Routes = [ 
     { path: '', component: ContactListComponent }, 
     { path: '/new', component: NewContactComponent }, 
     { path: '/about', component: AboutComponent } 
]; 


@NgModule({ 
    imports: [RouterModule.forRoot(routes)], 
    exports: [RouterModule] 
}) 
export class AppRoutingModule { } 

步驟4：加入路由組件到模塊象下面

@NgModule({ 
    declarations: [ 
    AppComponent, 
    ContactListComponent, 
    ContactComponent, 
    NewContactComponent, 
    AboutComponent 
    ], 
    imports: [ 
    BrowserModule, 
    FormsModule, 
    HttpModule, 
    AppRoutingModule 
    ], 
    providers: [ContactService], 
    bootstrap: [AppComponent] 
}) 

也試過像下面

export class AppComponent { 

    constructor(private routes: Router) { 

    } 

} 

因此，誰能告訴我，我做錯了注入路由器？

Answer 1

嘗試沒有斜槓（/）：

export const routes: Routes = [ 
     { path: '', component: ContactListComponent }, 
     { path: 'new', component: NewContactComponent }, 
     { path: 'about', component: AboutComponent } 
]; 

用斜槓，你可能會得到一個錯誤（「路徑不能以斜線開始...」）。