Question

同时导入

import { ResetComponent } from './pass-recovery/reset.component'; 

import { HomeComponent } from './HomeComponent';

路线路径

{ path: 'reset/:id/:token', component: ResetComponent, data : {type : 'password'} },

{ path: 'home', component: HomeComponent }

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

仅在有角度的第一次加载时出现问题，并且在第一次加载后它工作正常。当我在“ localhost：88 /＃/ reset / 12 / tokenabc”上路由时，它不会将其路由并转到主页。可能是因为它找不到路线。

Answer 1

删除数据属性，然后尝试获取

{ path: 'reset/:id/:token', component: ResetComponent}

Answer 2

显示您的online demo。

在app.module.ts

中

import { TestComponent } from './test/test.component';
import { Routes, RouterModule } from '@angular/router';
import { HomeComponent } from './home/home.component';

const routes: Routes = [
  {
    path: 'test/:id/:token',
    component: TestComponent
  },
  {
    path: 'home',
    component: HomeComponent
  },
  {
    path: '**',
    pathMatch: 'full',
    redirectTo: '/home'
  }
];

@NgModule({
  declarations: [
    AppComponent,
    TestComponent,
    HomeComponent
  ],
  imports: [
    BrowserModule,
    BrowserAnimationsModule,
    FormsModule,
    RouterModule.forRoot(routes, {
      useHash: true
    })
  ],
  entryComponents: [],
  bootstrap: [AppComponent]
})
export class AppModule {}

在app.component.html

中

<router-outlet></router-outlet>

Angular 4路由器的第一个加载路由不起作用

2 个答案: