Question

我的Ionic4 App始终加载主页。我尝试将其初始化为loadChildren，component和rederictTo，但仍然始终加载主页。

.app-routing.module.ts

<ion-app>
  <ion-router-outlet></ion-router-outlet>
</ion-app>

.app.component.html

const routes: Routes = [
  {
    path: '',
    component: HomePage
  }
];

.home.module.ts

const routes: Routes = [
  {
    path: '',
    component: OverviewPage
  }
];

.overview.module.ts

@NgModule({
  declarations: [AppComponent],
  entryComponents: [],
  imports: [
    BrowserModule, 
    IonicModule.forRoot(), 
    AppRoutingModule,
    AngularFireModule.initializeApp(environment.firebase),
    AngularFirestoreModule,
    IonicStorageModule.forRoot()
  ],
/...

.app.module.ts

    DECLARE  @Table1 table ([name] varchar(1000));

    INSERT INTO @Table1
        ([name])
    VALUES
        ('2018-08-08 23:02:57,731 INFO [AllRequestInterceptor] CRTST020'),
        ('2018-08-08 23:03:11,687 INFO [SOAPLoggingHandler] CRTST020'),
        ('2018-08-08 23:03:02,028 ERROR [AJAXController] CRTST003');


    SELECT DISTINCT Split.a.value('/S[1]', 'NVARCHAR(MAX)')+' '+ Split.a.value('/S[2]', 'NVARCHAR(MAX)') [Date],
            Split.a.value('/S[3]', 'NVARCHAR(MAX)') As Name,
            Split.a.value('/S[4]', 'NVARCHAR(MAX)') As Req,
            Split.a.value('/S[5]', 'NVARCHAR(MAX)') As Code
    FROM
    (
        SELECT   CAST('<S>'+REPLACE([name] ,' ','</S><S>' ) +'</S>' AS XML) AS [name]
        FROM @Table1
    ) AS A
    CROSS APPLY [name].nodes('S') AS Split(a)

Answer 1

我认为您必须在loadChild中使用OverviewModule而不是OverviewPageModule。

Answer 2

为此，我刚刚在路线防护中调用了导航功能。

目标是在应用启动时路由到登录页面，并防止导航到其他页面，直到通过身份验证为止（反之亦然-如果已经登录，则禁用登录路由）。

最终看起来像这样（路由保护器基本上具有相同的逻辑，但逻辑相反，并且在登录保护器中进行了一些额外的检查）：

app-routing.module.ts

...
const routes: Routes = [
    {
        path: '',
        canActivate: [TabsGuardService],
        resolve: {
            login: MidShiftLoginResolve
        },
        loadChildren: './tabs/tabs.module#TabsPageModule'
    },
    {
        path: 'login',
        canActivate: [LoginGuardService], // Routes back to '' if logged in already.
        loadChildren: () => import('./login/login.module').then(m => m.LoginPageModule)
    }
];
@NgModule({
    imports: [
        RouterModule.forRoot(routes, {
            preloadingStrategy: PreloadAllModules,
            onSameUrlNavigation: 'reload'
        })
    ],
    exports: [RouterModule]
})

tabs.guard.service.ts

@Injectable({
    providedIn: 'root'
})
export class TabsGuardService implements CanActivate {

    constructor(private router: Router, private login: LoginService) { }

    canActivate(route: ActivatedRouteSnapshot): Observable<boolean | UrlTree> |
            Promise<boolean | UrlTree> | boolean | UrlTree {
        const auth = this.login.isAuthenticated; // custom login service state
        if (!auth) {
            this.router.navigate(['/login']).then(null);
        }
        return auth;
    }
}

Ionic4型角形始终加载

2 个答案: