Я хочу переключить две страницы с помощью углового маршрутизатора, и я добавил эти два компонента в угловой маршрутизатор, но, независимо от того, какой URL я пытаюсь использовать, в браузере всегда отображается компонент «Логин». Если я удалю «login», «dashboard» будет успешно отображаться.
Это мой пример кода:
dashboard.component.ts
@Component({
selector: 'app-root',
templateUrl: './dashboard.component.html',
styleUrls: ['./dashboard.component.scss']
})
export class DashboardComponent {
title = 'dashboard';
}
login.component. ts
@Component({
selector: 'app-root',
templateUrl: './login.component.html',
styleUrls: ['./login.component.scss']
})
export class LoginComponent {
title = 'login';
}
app.component.html
<h1>{{title}}</h1>
<router-outlet></router-outlet>
app.component.ts
export class AppComponent implements OnInit {
title = 'Here is AppComponent';
ngOnInit() {}
}
app.module.ts
@NgModule({
declarations: [
AppComponent,
DashboardComponent,
LoginComponent
],
imports: [
BrowserModule,
AppRoutingModule,
SimpleNotificationsModule.forRoot(),
],
providers: [],
bootstrap: [DashboardComponent, LoginComponent]
})
export class AppModule { }
app-routing.module.ts
const appRoutes: Routes = [
{ path: 'login', component: LoginComponent },
{ path: 'dashboard', component: DashboardComponent },
];
@NgModule({
imports: [RouterModule.forRoot( appRoutes,
{ enableTracing: true })],
exports: [RouterModule]
})
export class AppRoutingModule { }
index.html
..
..
<base href="/">
</head>
<body>
<app-root></app-root>
</body>
</html>
Я полагаю, проблема в компоненте selector: 'app-root'?
Я надеюсь, что кто-то может мне помочь, и спасибо за вашу помощь.