0

私はAngular 10を使用しています。CoreModuleクラスにはコンポーネントがありますNavbarComponentNavbarComponentコンポーネントに次の HTML テンプレートがあります。

<mat-tab-group mat-align-tabs="end">
    <mat-tab routerLinkActive>Home</mat-tab>
    <mat-tab routerLink="/user/registration"></mat-tab>
    <mat-tab>Login</mat-tab>
</mat-tab-group>

リンクをクリックしても何も起こりません。URLは変わりません。ずっと同じhttp://localhost:4200/homeです。モジュールのクラスにはHomeModule、HTML テンプレートを持つコンポーネントがあります。

<app-navbar></app-navbar>
<app-footer></app-footer>

HomeRoutingModuleクラスには配列が含まれています。

const routes: Routes = [{ path: '', component: HomeComponent }];

AppRoutingModuleクラスには配列が含まれています。

const routes: Routes = [
  {
    path: 'home',
    loadChildren: () => import('./modules/home/home.module').then(m => m.HomeModule)
  },
  { path: 'user',
    loadChildren: () => import('./modules/users/users.module').then(m => m.UsersModule)
  },
  {
    path: '',
    pathMatch: 'full',
    redirectTo: 'home'
  },
];

UsersRoutingModuleクラスには配列が含まれています。

const routes: Routes = [
  {
    path: 'user',
    component: UsersComponent,
    children: [
      {
        path: 'registration',
        data: { title: 'registration' },
        component: UserRegistrationComponent,
      }
    ]
  }
];

プロジェクト構造:

ここに画像の説明を入力

実行済みにリダイレクトする方法がわかりませんUserRegistrationComponent。クリックすると: <mat-tab routerLink ="/user/registration "> URL は変わりません。

助けてください。どうもありがとうございました。

4

3 に答える 3