Super tabs Not working

Ionic Framework ionic-v3
1

Im first time trying super tabs (swipable tabs)
But cant get it worked, below is the eror details

Uncaught (in promise): Error: Template parse errors: Can't bind to 'root' since it isn't a known property of 'super-tab'. 1. If 'super-tab' is an Angular component and it has 'root' input, then verify that it is part of this module. 2. If 'super-tab' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message. 3. To allow any property add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component. (" <super-tabs> <super-tab [ERROR ->][root]="tab1Root" title="First page"></super-tab> <super-tab [root]="tab2Root" title="Second page">"): ng:///TabsPageModule/TabsPage.html@7:13 'super-tab' is not a known element: 1. If 'super-tab' is an Angular component, then verify that it is part of this module. 2. If 'super-tab' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message. (" <super-tabs> [ERROR ->]<super-tab [root]="tab1Root" title="First page"></super-tab> <super-tab [root]="tab2Root" title="Se"): ng:///TabsPageModule/TabsPage.html@7:2 Can't bind to 'root' since it isn't a known property of 'super-tab'. 1. If 'super-tab' is an Angular component and it has 'root' input, then verify that it is part of this module. 2. If 'super-tab' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message. 3. To allow any property add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component. (" <super-tabs> <super-tab [root]="tab1Root" title="First page"></super-tab> <super-tab [ERROR ->][root]="tab2Root" title="Second page"></super-tab> <super-tab [root]="tab3Root"

How to solve this ?

Capture
Capture.PNG306×547 38.5 KB

2

Hello,

maybe an import is missing. Has our page, were you use supertabs. a file like.*.module.ts? Here you need something like

import { SuperTabsModule } from 'ionic2-super-tabs';


@NgModule({
  declarations: [
    ...,
  ],
  imports: [
    SuperTabsModule,
  ....,
  ],

Best regards, anna-liebt

3 Likes
3

i imported in tabs.module.ts as below

import { NgModule } from '@angular/core';
import { TranslateModule } from '@ngx-translate/core';
import { IonicPageModule } from 'ionic-angular';

import { TabsPage } from './tabs';
import { SuperTabsModule } from 'ionic2-super-tabs';

@NgModule({
  declarations: [
    TabsPage,
  ],
  imports: [
    IonicPageModule.forChild(TabsPage),
    TranslateModule.forChild(),
SuperTabsModule,
  ],
  exports: [
    TabsPage
  ]
})
export class TabsPageModule { }

Still error

Uncaught (in promise): Error: No provider for SuperTabsController! Error: No provider for SuperTabsController! at injectionError
4

Thank you , Now its working,

I had to keep the imports in app.module.ts also

5

This was my case as well, very good notice !

7

how you can solve the problem ? can you help me!