我有一个运行良好的应用程序,但我想将其移至登录页面后。各个模块都是延迟加载的,并且运行良好。但是,当我将应用程序更改为始终始终先进入登录页面(将在其中检查登录状态并在登录后重定向到该应用程序)时,会收到有关路由的错误。
APP-routing.module.ts
import { NgModule } from '@angular/core';
import { PreloadAllModules, RouterModule, Routes } from '@angular/router';
const routes: Routes = [
{ path: '', loadChildren: './login/login.module#LoginPageModule' }
// this next line was how the app routed before I tried adding the login page
// { path: '', loadChildren: './tabs/tabs.module#TabsPageModule' }
];
@NgModule({
imports: [
RouterModule.forRoot(routes, { preloadingStrategy: PreloadAllModules })
],
exports: [RouterModule]
})
export class AppRoutingModule {}
login.router.module.ts
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { LoginPage } from './login.page';
const routes: Routes = [
{ path: '', component: LoginPage },
];
@NgModule({
imports: [RouterModule.forChild(routes)],
exports: [RouterModule],
})
export class LoginRoutingModule { }
login.page.ts
import { ChangeDetectionStrategy, Component } from '@angular/core';
import { Router } from '@angular/router';
import { Store } from '@ngrx/store';
import { AppState } from '../_store/store/app.store';
import { filter } from 'rxjs/operators';
@Component({
selector: 'app-login',
templateUrl: 'login.page.html',
styleUrls: ['login.page.scss'],
changeDetection: ChangeDetectionStrategy.OnPush,
})
export class LoginPage {
constructor(private router: Router, private store: Store<AppState>) {
this.userSubscription = this.store.select(state => state.users.user).pipe(
filter(user => !!user)
).subscribe(user => {
if (user) {
// THIS IS WHERE THE ERROR HAPPENS
this.router.navigate(['/tabs']);
}
});
}
}
this.router.navigate([ '/翼片']);错误发生的地方:
错误错误:未被捕获(承诺):错误:无法匹配任何路由。URL段:“标签/行为”错误:无法匹配任何路由。网址细分:“标签/行为”
我确定我在这里确实缺少一些明显的东西。第一次尝试延迟加载所有模块。我确定我需要以某种方式在login.page文件中或在login.router.module中引用tabs模块。任何帮助将不胜感激。用户状态的状态检查效果很好,我已经验证了所有功能都在起作用,它只是在找到用户后尝试进行导航的地方。
尝试更改为
const routes: Routes = [
{ path: '', redirectTo: 'login', pathMatch: 'full' },
{ path: 'login', loadChildren: './login/login.module#LoginPageModule' }
{ path: 'tabs', loadChildren: './tabs/tabs.module#TabsPageModule' }
];
使用此代码this.router.navigate(['/tabs']);
,您将路由到制表符,但没有声明它。