Angular4刷新頁面在url中重複頁面

我是一個有角的newb並構建了一個簡單的尋呼機。我有路由器設置，以便空的url重定向到Dashboard組件。因此localhost:4200會自動轉到localhost:4200/dashboard完美。Angular4刷新頁面在url中重複頁面

但是，如果我點擊刷新按鈕，它會追加另一個儀表板到網址，奇怪的是，頁面實際上加載罰款。 localhost:4200/dashboard/dashboard

如果我打再次刷新它增加了一個其他信息中心的URL，現在它不會加載

localhost:4200/dashboard/dashboard/dashboard

問題的存在，爲什麼它不斷添加「/儀表板」，以我的網址上每頁刷新？

這裏是routing.module.ts

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

import { DashboardComponent } from '../_feature/iacuc/dashboard.component'; 

const appRoutes: Routes = [ 
    { path: '', redirectTo: 'dashboard', pathMatch: 'prefix' }, 
    { path: 'dashboard', component: DashboardComponent } 

    // otherwise redirect to home 
    { path: '**', redirectTo: '' } 
]; 

export const Routing = RouterModule.forRoot(appRoutes);

這裏是我的index.html

<!DOCTYPE html> 
<html> 
<head> 
    <base href="/" > 
    <title>Angular 2 JWT Authentication Example</title> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 

    <!-- bootstrap css --> 
    <link href="//netdna.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" /> 

    <!-- application css --> 
    <link href="app.css" rel="stylesheet" /> 

    <!-- polyfill(s) for older browsers --> 
    <script src="node_modules/core-js/client/shim.min.js"></script> 

    <script src="node_modules/zone.js/dist/zone.js"></script> 
    <script src="node_modules/systemjs/dist/system.src.js"></script> 

    <script src="systemjs.config.js"></script> 
    <script> 
     System.import('app').catch(function (err) { console.error(err); }); 
    </script> 
</head> 
<body> 
    <app>Loading...</app> 
</body> 
</html>

的代碼的其餘部分是你在介紹例子中看到的樣板，但我可以顯示更多代碼是否有用。

謝謝。

來源

2017-10-19 user441058

'pathMatch： 'prefix''改變'pathMatch：' full'' –

的關鍵詞是字面上的 '前綴' haha – Carsten

'full'也不起作用。 – user441058

需要使用pathMatch: 'full'代替pathMatch: 'prefix'

在這裏讀到：https://angular.io/api/router/Routes

來源

2017-10-19 06:26:05 micronyks

除了按照您的建議將其更改爲pathMatch：'full'外，還需要更改從使用字符串到使用組件名稱的路由。它將該字符串附加到根網址。正確的路線：{path：''，component：DashboardComponent，pathMatch：'full'} – user441058

Angular4刷新頁面在url中重複頁面

回答

相關問題