Ionic Swipeable Tabs are now here!


#123

@ihadeed first of all, thanks for this great plugin!

Is there also a possibility to add a “spaceBetween” the pages like in the ion-slides?
-> https://ionicframework.com/docs/api/components/slides/Slides/ -> “Input Properties” -> “spaceBetween”

Thanks so far,
Unkn0wn0x


#124

I got an error .So far what i have done is
npm install ionic2-super-tabs --save

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



imports: [
    BrowserModule,
    IonicModule.forRoot(MyApp),
    SuperTabsModule

  ],

My Tabs.html file

<super-tabs>
    <super-tab [tabRoot]="tab1Root" title="First page"></super-tab>
    <super-tab [tabRoot]="tab1Root" title="Second page"></super-tab>
    <super-tab [tabRoot]="tab1Root" title="Third page"></super-tab>
</super-tabs>

**_

ERROR IS
compiler.js:466 Uncaught Error: Template parse errors:
Can’t bind to ‘tabRoot’ since it isn’t a known property of ‘super-tab’.

  1. If ‘super-tab’ is an Angular component and it has ‘tabRoot’ 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-tab [ERROR ->][tabRoot]=“tab1Root” title=“First page”>
    <super-tab [tabRoot]=“tab1Root” title=“Secon”): ng:///AppModule/TabsPage.html@1:15
    ’super-tab’ is not a known element:
  4. If ‘super-tab’ is an Angular component, then verify that it is part of this module.
  5. If ‘super-tab’ is a Web Component then add ‘CUSTOM_ELEMENTS_SCHEMA’ to the ‘@NgModule.schemas’ of this component to suppress this message. ("
    [ERROR ->]<super-tab [tabRoot]=“tab1Root” title=“First page”>
    <super-tab [tabRoot]=“tab1Root” t"): ng:///AppModule/TabsPage.html@1:4

_**


#125

Hi,
I just start new project and install swipable tabs. But tabs are without any CSS style and also can’t be changed by swiping.

Should I place CSS manually to the project?

Thanks


#126

I think there is a bug in the newest version. See this issue on github. Try reverting to 4.1.4.
npm install ionic2-super-tabs@4.1.4


#127

use: [root] instead of [tabRoot]


#128

Thanks, It worked :+1::+1:


#129

Hi. I facing some problem when i try to use this plugin in my project. I’m using ionic v 3.9.2

the tabs doesnt display as it should. it show something similar to this.
https://uploads.disquscdn.com/images/e589358f321ce83cfcfe86b1395faa1d58b1e68c92dffa3f5516bd7aea1409b6.png

i’m following steps by steps from documentation.


#130

UPDATE: All of sudden the code working but tab at top of title and swipe did not working


#131

Hello, @ihadeed

I follow your code for swipeable tabs

but when i go to page i got error like
Cannot find module "…/ionic2-super-tabs/src"
and page shows white screen

please help me


#134

Hey Hi… First of all thank you so much for this solution on swipeable tabs…!!! very useful…

I need some suggestions on the following:
I am stuck in a situation where the Home page tab has segments in it. Now when the user swipes left it should switch the segments and once the end of segment is reached then the next swipe should switch the tabs. Please let me know if this is achievable with your above solution. Badly in need of a solution for this requesting you to please help me…

Thanks in advance :slight_smile:2018_01_29_16_58_33_Ionic_App


#135

Hey guys

I got locked out of my account that I used for this post.

Came here to say, if you’re having trouble with this module, please go to the Github repository. Check existing issues, read any notes in the readme file, and then post a new issue if you still can’t find what you’re looking for.

I will not be monitoring any issues and/or provide any kind of support here. Github issues are more organized, and they make it easier to track issues & respond to them.

Thanks for understanding!


#136

Hi, I have raised this requirement as an issue in your git hub repo (https://github.com/zyra/ionic2-super-tabs/issues/257) Requesting you to please address the same.

Thanks