ion-tabs layout errors

[microwin168]

Bug Report

If I nested a <ion-tabs> in a <ion-tab>,the layout is not I expected
Ionic Info
Run ionic info from a terminal/cmd prompt and paste the output below.

Ionic:

   ionic (Ionic CLI)          : 4.1.2 (/Users/microwin/.nvm/versions/node/v10.5.0/lib/node_modules/ionic)
   Ionic Framework            : @ionic/angular 4.0.0-beta.7
   @angular-devkit/core       : 0.7.5
   @angular-devkit/schematics : 0.7.5
   @angular/cli               : 6.1.5
   @ionic/ng-toolkit          : 1.0.8
   @ionic/schematics-angular  : 1.0.6

System:

   NodeJS : v10.5.0 (/Users/microwin/.nvm/versions/node/v10.5.0/bin/node)
   npm    : 6.4.1
   OS     : macOS High Sierra

Describe the Bug
If I nested a <ion-tabs> in a <ion-tab>,the layout is not I expected.

Relate Code

[siva563]

@microwin168 are you able to run normal tabs, I am facing one issue.

<ion-tabs color="primary" class="activity-tabs" tabbarPlacement="top" (ionChange)="ionChange()" tabbar-highlight="true">
    <ion-tab padding-horizotal active="true" class="ionTabsPublic" label="Upcoming" href="/events/memberEvents/(upcoming:upcoming)">
      <ion-router-outlet name="upcoming"></ion-router-outlet>
    </ion-tab>
    <ion-tab padding-horizotal label="Current" href="events/memberEvents/(current:current)">
      <ion-router-outlet name="current"></ion-router-outlet>
    </ion-tab>
    <ion-tab padding-horizotal label="Past" href="events/memberEvents/(past:past)">
      <ion-router-outlet name="past"></ion-router-outlet>
    </ion-tab>
  </ion-tabs>

routing.ts file:

const routes: Routes = [
  {
    path: 'memberEvents',
    component: EventsPage,
    children: [
      {
        path: 'upcoming',
        outlet: 'upcoming',
        component: MemberUpcomingEventsPage
      },
      {
        path: 'past',
        outlet: 'past',
        component: MemberPastEventsPage
      },
      {
        path: 'current',
        outlet: 'current',
        component: MemberCurrentEventsPage
      }
    ]
  },
  {
    path: '',
    redirectTo: '/events/memberEvents/(upcoming:upcoming)'
  }
];

While click on each tab, where I need call rest api call(Latest data from DB).

could you please help me if you have some time

[RHinderiks]

@siva563 I commented on your ticket. Please dont comment on someone else's ticket with a question when you already got a ticket up with that same question

[mhartington]

@microwin168 the tabs on the home.page.html should not be inside the ion-content, that is causing your issue. As this is more of a support question, please continue the conversation over on the ionic forum