我正在开发一个angular2网络应用程序 . 我已经有一些设置的路由都按预期工作 . 我最近添加了一个收货的视图,我遇到了一个非常奇怪的错误...我将路径和组件添加到我的app.routing.ts并添加了一个路由器链接到我的导航组件(这是一个bootstrap导航栏.. . )当我运行我的应用程序时,收到的货物链接显示在导航栏中,当我点击它时,路由器导航到视图但链接没有显示在地址栏中并重新加载页面返回到我之前的视图在...任何想法可能导致这个?

我的代码:

app.routing.ts:

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

import { HomeComponent } from './Components/home/home.component';
import { CheckBarcodesComponent } from './Components/check-barcodes/check-barcodes.component';
import { SettingsComponent } from './Components/settings/settings.component';
import { StockTakeComponent } from './Components/stock-take/stock-take.component';
import { GoodsReceivedComponent } from './components/goods-received/goods-received.component';

const appRoutes : Routes = [
{path: "goodsReceived", component: GoodsReceivedComponent },
{path: "settings", component: SettingsComponent },
    {path: "checkBarcodes", component: CheckBarcodesComponent },
    {path: "home", component: HomeComponent},
    {path: "", redirectTo: 'home', pathMatch: 'full'},
    {path: "stockTake", component: StockTakeComponent}  
];

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

导航component.html:

<nav class="navbar navbar-default">
<nav class="navbar navbar-default navbar-static-top">
<div class="container-fluid">
    <div class="navbar-header">
        <button class="navbar-toggle navbar-toggle-right" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria="navbarSupportedContent"
aria-expanded="false" aria-label="toggle navigation"><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button>
    </div>
    <a class="navbar-brand" href="#"><img class="logo" src="../../../assets/pictures/TMNewLogo.gif" style="height:100px; width:200px; text-align:center;"><p class="navbar-text">Retail Mobile</p></a>

    <div class="collapse navbar-collapse" id="navbarSupportedContent">
        <ul class="nav navbar-nav">
            <li [routerLinkActive]="['active']" [routerLinkActiveOptions]="{exact:true}" class="nav-item"><a [routerLink]="['home']"><span class="glyphicon
glyphicon-home"></span> Home</a></li>
            <li [routerLinkActive]="['active']" [routerLinkActiveOptions]="{exact:true}" class="nav-item"><a [routerLink]="['checkBarcodes']"><span class="glyphicon
glyphicon-barcode"></span> Check Barcodes</a></li>
            <li [routerLinkActive]="['active']" [routerLinkActiveOptions]="{exact:true}" class="nav-item"><a [routerLink]="['stockTake']"><span class="glyphicon
glyphicon-folder-open"></span> Stock Take</a></li>
<li [routerLinkActive]="['active']" [routerLinkActiveOptions]="{exact:true}" class="nav-item"><a [routerLink]="['goodsReceived']"><span class="glyphicon
glyphicon-list"></span> Goods Received</a></li>

            <li [routerLinkActive]="['active']" [routerLinkActiveOptions]="{exact:true}" class="nav-item"><a [routerLink]="['settings']"><span class="glyphicon
glyphicon-wrench"></span> Settings</a></li>
        </ul>
    </div>
</div>
</nav>