角2路線不工作

我已經創建了一個使用CLI的角2應用程序，我剛剛瞭解它，我試圖設置一個路線，但由於某種原因，它不工作，當鏈接被點擊的URL是正確顯示，但在HTML內容是一樣的，我想顯示未顯示組件的內容......角2路線不工作

這是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'; 
import { ProductListComponent } from '../products/product-list.component'; 

@NgModule({ 
    imports: [ 
    BrowserModule, 
    FormsModule, 
     HttpModule, 
     RouterModule.forRoot([ 
      { path: 'products', component: ProductListComponent } 
     ]) 
    ], 
    declarations: [ 
     AppComponent, ProductListComponent 
    ], 
    //providers: [], 
    bootstrap: [AppComponent] 
}) 
export class AppModule { }

這是我product-list.component.ts文件的代碼：

import { Component, OnInit } from '@angular/core'; 
@Component({ 
    template: '<p>Component product list</p>' 
}) 

export class ProductListComponent { 
title: 'The Products from Component...'; 
}

我不知道我做錯了什麼，開發人員工具控制檯中沒有錯誤，當鏈接被點擊時沒有任何http請求...

我的鏈接說的是在app.component.html：

<h1> 
    {{title}} 
</h1> 
<p>This is a test</p> 
<a [routerLink] ="['/products']"> Values list</a>

主要網址是這個：http://localhost:4200，並單擊鏈接時它改變http://localhost:4200/products只是鏈接不改變HTML，不被顯示product-list.component.ts的內容.. 任何想法？我有什麼方法可以找出發生了什麼？

來源

2017-07-07 AlexGH

看起來你可能會丟失在您的.html的router-outlet指令。

<h1> 
    {{title}} 
</h1> 
<p>This is a test</p> 
<router-outlet></router-outlet> 
<a [routerLink] ="['/products']"> Values list</a>

來源

2017-07-07 21:10:10 DeborahK

謝謝Deborah，我在Pluralsight中看到過你的視頻教程「Angular：Getting Started」，非常棒！ :) – AlexGH

謝謝！我也有一個關於路由，如果你想了解更多信息：https：//app.pluralsight.com/library/courses/angular-routing/table-of-contents – DeborahK

謝謝！我會一直看！ :) – AlexGH

角2路線不工作

回答

相關問題