Angular 路由不起作用，重定向到主组件

Question

我有一个应用程序，其中组件很少，路由定义如下：

import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
import { MeetComponent } from './meet-page/meet-page.component';
import { RouterModule, Routes } from '@angular/router';
import { LoginComponent } from './login/login.component';
import { HostComponent } from './host/host.component';

const routes: Routes = [
  {
    path: '',
    component: AppComponent
  },
  {
    path: 'meeting/:id',
    component: MeetComponent
  },
  {
    path: 'host/:id',
    component: HostComponent
  },
  {
    path: 'login',
    component: LoginComponent
  }
];

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

我无法访问默认路径以外的其他路径，当我尝试单击应该将我移至 localhost:4200/login 的按钮时，它会将我重定向回主页。与手动输入路径相同。

我尝试了不同的组件，但没有想法

Answer 1

您应该尝试使用按钮中的路由器链接导航到所需的网址：

routerLink="/login"

。 如果您也能提供您的

app.component.html

和

appConfig

那就太好了