Quantcast
Channel: Ionic Forum - Latest topics
Viewing all articles
Browse latest Browse all 70440

Ionic tabs with new pages

$
0
0

In previous versions of ionic I am used to using the tabs in the root but I see all the new examples change this where it has its own modules and child routes. I am running V4 of ionic.

  1. I want to know if new pages should be declared in a single routing page or should they be in separate routing files(one inherited by the app.module and one by the tabs.module)

  2. I am trying to run a route guard on my routes using Angularfire (not angularfireauthguard) but I keep getting a nullinjector error for the Angular auth service.

  • I have tried importing the auth module into both the tab and the root but that doesnt work.
  • I think it has something to do with the fact that the the tabs are trying to navigate to a route not declared in teh tab routing.

its a standard auth guard that accesses the Agularfire service.

Below is a code snippet of the auth guard.

canActivate(
    next: ActivatedRouteSnapshot,
    state: RouterStateSnapshot,
  ): Observable<boolean> | Promise<boolean> | boolean {
    return this.afauth.authState.pipe(
      map((user: firebase.User) => {
        if (user.isAnonymous || user === null) {
          this.presentToast('You need to be logged in to access this feature.');
          this.router.navigateByUrl('/signin');

          return false;
        } else {
          console.log(next.url);
          /**if (next.url === 'signin' || next.url === 'signun') {
            this.presentToast('You are already authenticated.');
            this.router.navigateByUrl('/tabs/scan');
            return false;
          }**/
          return true;
        }
      }),
    );
  }

Below is a snippet of my tabs

path: 'tabs',
    component: TabsPage,
    children: [
      {
        path: 'account',
        children: [
          {
            path: '',
            loadChildren: '../pages/account/account.module#AccountPageModule',
            canActivate: [AuthGuard],
          },
        ],
      },

Snippet of my app.routing

{
    path: 'detail-account',
    loadChildren: './pages/detail-account/detail-account.module#DetailAccountPageModule',
    canActivate: [AuthGuard],
  },

4 posts - 2 participants

Read full topic


Viewing all articles
Browse latest Browse all 70440

Trending Articles