У меня странная проблема, я клонировал ngx-admin и пытаюсь использовать тему в качестве базовой темы.
Я создал Layout Components
с Modules
с включенным Routing
. Созданы маршруты и подключенные компоненты, но проблема в том, что маршруты работают нормально, если я открываю их по ссылке напрямую. Но когда я пытаюсь использовать router.navigate
для перенаправления, маршруты не работают.
ниже находятся мои файлы
app-routing.module.ts
import { ExtraOptions, RouterModule, Routes } from '@angular/router';
import { NgModule } from '@angular/core';
import { DashboardLayoutComponent } from './layouts/dashboard-layout/dashboard-layout.component';
import { AuthenticationLayoutComponent } from './layouts/authentication-layout/authentication-layout.component';
const routes = [
{
path: '',
redirectTo: 'app',
pathMatch: 'full',
},
{
path: '',
component: DashboardLayoutComponent,
children: [
{
path: 'app',
loadChildren: () => import('./layouts/dashboard-layout/dashboard-layout.module').then(m => m.DashboardLayoutModule)
}
]
},
{
path: '',
component: AuthenticationLayoutComponent,
children: [
{
path: 'auth',
loadChildren: () => import('./layouts/authentication-layout/authentication-layout.module').then(m => m.AuthenticationLayoutModule)
}
]
},
{
path: '**',
redirectTo: 'app'
}
];
export const AppRoutingModule : Routes = routes;
app.module.ts
@NgModule({
declarations: [
AppComponent,
DashboardLayoutComponent,
AuthenticationLayoutComponent
],
imports: [
BrowserModule,
BrowserAnimationsModule,
HttpClientModule,
RouterModule.forRoot(AppRoutingModule),
CookieModule.forRoot(),
ThemeModule.forRoot(),
NbSidebarModule.forRoot(),
NbMenuModule.forRoot(),
NbWindowModule.forRoot(),
NbToastrModule.forRoot(),
CoreModule.forRoot(),
FormsModule,
ReactiveFormsModule
],
providers: [AuthGuard, AuthService],
bootstrap: [AppComponent],
})
export class AppModule {
}
auth-layout.routing.ts
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { LoginComponent } from '../../pages/auth/login/login.component';
import { ForgotComponent } from '../../pages/auth/forgot/forgot.component';
import { VerifyComponent } from '../../pages/auth/verify/verify.component';
export const AuthenticationLayoutRoutingModule : Routes = [
{ path: '', redirectTo: 'login', pathMatch: 'full' },
{ path: 'login', component: LoginComponent },
{ path: 'forgot', component: ForgotComponent },
{ path: 'verify/invite/:_hash', component: VerifyComponent},
{ path: '**', redirectTo: 'login' }
]
auth-layout.module.ts
@NgModule({
declarations: [
LoginComponent,
ForgotComponent,
VerifyComponent
],
imports: [
CommonModule,
RouterModule.forChild(AuthenticationLayoutRoutingModule),
ThemeModule,
NbAlertModule,
FormsModule,
ReactiveFormsModule,
NbPopoverModule,
NbCardModule,
NbIconModule
],
})
export class AuthenticationLayoutModule { }
Я пытаюсь перейти от компонента Verify к компоненту входа, ниже приведен код
constructor(private router: Router, private activatedRoute: ActivatedRoute, private authService: AuthService, private toastrService: NbToastrService) {}
ngOnInit() {
this.router.navigate['/auth/login'];
}
Но если я воспользуюсь приведенным ниже кодом , Он будет правильно перенаправлять
<a [routerLink]="['/auth/login']">Click to redirect</a>
Пожалуйста, скажите мне, если я делаю что-то не так.