生成一個新的Component:
在NgModule檔案app.module.ts裡,找到RouterModule.forRoot, 新增一條路由資訊:
這條路由資訊将url同Component ProductDetailsComponent關聯起來。
我們期望實作的效果是,使用者點選産品清單時,跳轉到産品明細頁面去。是以,打開product-list Component的模闆,在标簽a上增加路由資訊:[routerLink]="[’/products’, productId]"
同時,這個productId變量尚未在product list Component裡聲明,是以需要增添一行:index as productId:
最後的效果:
點選product name超連結後:
跳轉到product明細頁面: