Ion tabs not rendering component views


#1

From some reason when pushing my tabs component, the views for the components in the tabs are not rendering. I know the components are initializing because I can see the ngOnInit console logs in the console But I get an error upon pushing the tabs component: tabs.js:245 Uncaught TypeError: Cannot read property ‘nativeElement’ of undefined

Here is the tabs component that is being pushed.

@Component({
    selector: 'wic-vendor-tabs',
    template: `
    <ion-tabs>
      <ion-tab tabIcon="water" tabTitle="Water" [root]="tab1"></ion-tab>
      <ion-tab tabIcon="leaf" tabTitle="Life" [root]="tab2"></ion-tab>
      <ion-tab tabIcon="flame" tabTitle="Fire" [root]="tab3"></ion-tab>
    </ion-tabs>
    `
})
export class VendorTabsComponent {
    tab1: any = WicVendorListComponent;
    tab2: any = ViewWicVendorsComponent;
    tab3: any = WicVendorFavoritesComponent;

    constructor() {}
}

And expanding the error in console:

tabs.js:245 Uncaught TypeError: Cannot read property 'nativeElement' of undefined
Tabs.setTabbarPosition @ tabs.js:245
Content.writeDimensions @ content.js:279
PageTransition.writeDimensions @ page-transition.js:31
Animation._beforeWriteFn @ animation.js:369
Animation._beforeWriteFn @ animation.js:365
Animation._playDomInspect @ animation.js:174

Also, the tab bar does not render either, but im able to click on where the tabs should be and I can see the components loading in the console but still no view being rendered for those components. Any idea on how to get the view to render when i push the tabs component? Thanks in advance.


#2

did you solve this @gciluffo ?