在添加路由器插座後，角度種子卡在「加載...」

Question

在新的Angular種子應用（ng new）中，只要我將此添加到app.component，應用就會停留在「加載...」 html的：

<router-outlet></router-outlet> 

我也嘗試注入Router：

export class AppComponent { 
    constructor(router: Router) { } 
    title = 'app works!'; 
} 

和事情變得更加古怪。只要我有router-outlet標籤，它仍然停留在「正在加載...」。一旦我刪除（但仍然注入Router），我會看到一個空白屏幕（即，甚至沒有「加載...」）。

app.module.ts文件：

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

import { AppComponent } from './app.component'; 

@NgModule({ 
    declarations: [ 
    AppComponent 
    ], 
    imports: [ 
    BrowserModule, 
    FormsModule, 
    HttpModule, 
    RouterModule 
    ], 
    providers: [], 
    bootstrap: [AppComponent] 
}) 
export class AppModule { } 

app.component.ts：

import { Component } from '@angular/core'; 
import { Router } from '@angular/router'; 

@Component({ 
    selector: 'app-root', 
    templateUrl: './app.component.html', 
    styleUrls: ['./app.component.css'] 
}) 
export class AppComponent { 
    title = 'app works!'; 
} 

app.component.html：

<h1> 
    {{title}} 
</h1> 
<router-outlet></router-outlet> 

UPDATE

我得到四款瀏覽器錯誤：

Answer 1

好吧，

import { RouterModule } from '@angular/router'; 
.... 
imports: [ 
    BrowserModule, 
    FormsModule, 
    HttpModule, 
    RouterModule 
    ], 

您需要添加路由器模塊的app.module.ts文件中