Angular 6 - RouterLink 导航但不更改 URL

问题描述

app.component.html

app.component.html

<nav>
 <a routerLink="/dashboard"></a>
 <a routerLink="/reports"></a>
<nav>
<main role="main" class="page-container">
  <router-outlet></router-outlet>
</main>

app-routing.module.ts

app-routing.module.ts

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { DashboardComponent } from './dashboard/dashboard.component';
import { ReportsComponent } from './reports/reports.component';

const routes: Routes = [
  { path: 'dashboard', component: DashboardComponent },
  { path: 'reports', component: ReportsComponent },
  { path: '',
    redirectTo: '/dashboard',
    pathMatch: 'full'
  }];

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

app.module.ts

app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppComponent } from './app.component';
import { AppRoutingModule } from './app-routing.module';
import { DashboardComponent } from './dashboard/dashboard.component';
import { ReportsComponent } from './reports/reports.component';


@NgModule({
  declarations: [
    AppComponent,
    DashboardComponent,
    ReportsComponent
  ],
  imports: [
    BrowserModule,
    AppRoutingModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule {

}

通过上面的代码，我看到点击导航链接时，可以导航到相应的组件，但由于某种原因，URL 没有更新.

With the above code, I see that on click of the nav links, am able to navigate to the corresponding component but for some reason, URL is not getting updated.

不确定这里是否遗漏了一些非常基本的东西.请帮忙.

Not sure if am missing something pretty basic here. Please help.

推荐答案

如果您正在运行混合应用程序(带有升级模块)，请将 useHash 添加到路由器配置

if you are running hybrid app(with upgrade module) add useHash to router config

imports: [RouterModule.forRoot(routes, { useHash: true, enableTracing: true })],

这篇关于Angular 6 - RouterLink 导航但不更改 URL的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！