В моем приложении у меня есть две основные части:
- Авторизация - страницы входа и регистрации
- Панель - основные страницы приложения
В моем app.component.html у меня есть выход маршрутизатора для навигации по компонентам авторизации и Panel.
Однако в упомянутых компонентах у меня есть другие выходы маршрутизатора для навигации между картами (подкомпонентами). Я попытался сделать маршрутизацию отдельно для каждого модуля, но это не работает. Когда я иду по пути, например. "/ authorization / login" Я получил ошибку, что такой URL не существует.
Вот мой app-routing.module.ts
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { PanelComponent } from '../panel/panel.component';
import { AuthorizationComponent } from '../authorization/authorization.component';
import { DeliveriesComponent } from '../panel/cards/deliveries/deliveries.component';
const routes: Routes = [
{path: '', redirectTo: 'authorization', pathMatch: 'full'}
];
@NgModule({
imports: [
RouterModule.forRoot(routes)
],
exports: [RouterModule]
})
export class RoutingModule {
}
разрешительного routing.module.ts
const authorizationRoutes: Routes = [
{path: 'authorization', component: AuthorizationComponent, children: [
{path: 'authorization/register', component: RegisterComponent},
{path: 'authorization/login', component: LoginComponent},
{path: 'authorization/restaurant-registration', component: RestaurantRegistrationComponent},
{path: 'authorization/confirmation', component: ConfirmationComponent}
]
}
];
@NgModule({
imports: [
RouterModule.forChild(authorizationRoutes)
],
exports: [RouterModule]
})
export class AuthorizationRoutingModule {
}
app.module.ts
import { PanelModule } from './panel/panel.module';
import { AuthorizationModule } from './authorization/authorization.module';
import { RoutingModule } from './routing/routing.module';
import { AppComponent } from './app.component';
@NgModule({
declarations: [
AppComponent,
],
imports: [
BrowserModule,
LayoutModule,
PanelModule,
AuthorizationModule,
FormsModule,
RoutingModule
],
providers: [],
bootstrap: [
AppComponent,
]
})
export class AppModule {
}
Не могли бы вы объяснить, что я делаю не так с этой маршрутизацией? Я пробовал много способов решить эту проблему, но ничего не помогло.