Angular 6-RouterLink导航但不更改URL [英] Angular 6 - RouterLink navigates but not changing URL

查看:151
本文介绍了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的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆