Перейдите со страницы входа на вкладки в Ionic4?

Question

Я создаю приложение и хочу перейти со страницы входа на страницу вкладок. Когда я пытаюсь перейти на страницу вкладок, на ней отображается только домашняя страница без вкладок.

вот мой кодекс

приложение-routing.module.ts

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';

const routes: Routes = [
      { path: '', redirectTo: 'login', pathMatch: 'full' },
      { path: 'login', loadChildren: './pages/login/login.module#LoginPageModule' },

      { path: 'tabs', loadChildren: './pages/tabs/tabs.module#TabsPageModule' }
];

@NgModule({
   imports: [RouterModule.forRoot(routes)],
   exports: [RouterModule]
})
export class AppRoutingModule { }

tabs.module.ts

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { Routes, RouterModule } from '@angular/router';
import { IonicModule } from '@ionic/angular';

import { TabsPageRoutingModule } from './tabs.router.module';

import { TabsPage } from './tabs.page';
import { HomePageModule } from '../home/home.module';
import { ActivityPageModule } from '../activity/activity.module';
import { MygroupsPageModule } from '../mygroups/mygroups.module';
import { MessagesPageModule } from '../messages/messages.module';
import { SettingsPageModule } from '../settings/settings.module';


@NgModule({
  imports: [
    CommonModule,
    FormsModule,
    IonicModule,
    TabsPageRoutingModule,
    HomePageModule, 
    ActivityPageModule,
    MygroupsPageModule,
    MessagesPageModule,
    SettingsPageModule
  ],
  declarations: [TabsPage]
})
export class TabsPageModule {}

tabs.router.module.ts

import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';

import { TabsPage } from './tabs.page';
import { HomePage } from '../home/home.page';
import { ActivityPage } from '../activity/activity.page';
import { MygroupsPage } from '../mygroups/mygroups.page';
import { MessagesPage } from '../messages/messages.page';
import { SettingsPage } from '../settings/settings.page';



const routes: Routes = [
  {
    path: 'tabs',
    component: TabsPage,
    children: [
      {
        path: '',
        redirectTo: '/tabs/(home:home)',
        pathMatch: 'full',
      },
      {
        path: 'home',
        outlet: 'home',
        component: HomePage
      },
      {
        path: 'activity',
        outlet: 'activity',
        component: ActivityPage
      },
      {
        path: 'mygroups',
        outlet: 'mygroups',
        component: MygroupsPage
      },
      {
        path: 'messages',
        outlet: 'messages',
        component: MessagesPage
      },
      {
        path: 'settings',
        outlet: 'settings',
        component: SettingsPage
      }
    ]
  }
];

@NgModule({
  imports: [RouterModule.forChild(routes)],
  exports: [RouterModule]
})
export class TabsPageRoutingModule {}

Со страницы входа я перемещаюсь таким образом.

this.router.navigate(['tabs']);

но это просто показывает домашнюю страницу без вкладок. Можете ли вы указать мне, что мне делать, даже если в DOM не отображаются вкладки, я попытался их проверить. Это просто показывает домашнюю страницу как страницу по умолчанию.

Answer 1

У меня была та же проблема, навигация не работает на странице вкладок. Чтобы избежать проблемы, я сделал это:

this.navCtrl.navigateRoot('/home'); // I use NavCtroller instead of Router

и в app-routing.module.ts:

{ path: 'home', redirectTo: '/tabs/(home:home)' },

Я надеюсь, что это будет работать правильно в следующей бета-версии.