Question

我正准备使用角度路由器从一个组件移动到另一个组件，但是会发生以下情况：

当我在 http://localhost:4200/#/home 然后执行url更改以移至

http://localhost:4200/#/view

使用

route.navigate(["view"]) /  routerLink="/view"

URL更改但又返回首页，但是当我手动将URL更改为

http: // localhost: 4200 / # / view

它运行完美。

发生了什么事？

我使用以下代码

import { HomeComponent } from './home/home.component';
import { RouterModule, Routes } from '@angular/router';
import { ModuleWithProviders } from '@angular/core/src/metadata/ng_module';
import { ViewpostComponent } from './viewpost/viewpost.component';


export const AppRoutes: Routes = [
    { path: '', redirectTo: '/home', pathMatch: 'full' },
    { path: 'home', component: HomeComponent },
    { path: 'view', component: ViewpostComponent }
];

export const Rutas: ModuleWithProviders = RouterModule.forRoot(AppRoutes, { useHash: true });

Answer 1

您的路线顺序很重要。更改顺序如下：

export const AppRoutes: Routes = [{
    path: 'home',
    component: HomeComponent
  },
  {
    path: 'view',
    component: ViewpostComponent
  },
  {
    path: '',
    redirectTo: '/home',
    pathMatch: 'full'
  }
];

同样由Richards建议，如果您尝试从组件类中导航，请使用this.route.navigate(['/view']);

这里是StackBlitz供您参考。

Answer 2

['view']和['/ view']都相同如果它不起作用，请发布模板代码路线导入的顺序和匹配打算使用router.navigate（[]）的目的是，如果您在home组件中调用router.navigate（[]）时，逻辑完成将用户重定向到特定页面，您可以向我们显示代码吗

Angular 4更改路线

2 个答案: