Ionic Tabs inside Slide Box - Ionic serve –lab

1

I’ve put an Ion Tab inside a Slidebox. This looks perfect in android, however in IOS this doesn’t work. ionic serve --lab gets me this

image
ionic_serve_lab.png910×747 309 KB

IOS renders tabs fine if done separately in a new view. So I don’t see what’s wrong here… My top nav is an implementation of tabbed slide box on github here. My code looks like this:

<tab-slide-box id="sibling_id" tab="0">
            <div class="tsb-icons">
                <div class="tsb-ic-wrp">
                    <ion-scroll direction="x" class="tsb-hscroll">
                    <a href="#" icon-off="fa-home" icon-on="fa-home"></a>
                    <a href="" icon-off="ion-tshirt-outline" icon-on="ion-tshirt" ng-click="goTo('index.collections')"></a>
                    <a href="" icon-off="fa-gift" icon-on="fa-gift" ng-click="goTo('index.chats')"></a>
                    <a href="" icon-off="fa-user" icon-on="fa-user" ng-click="goTo('index.account')"></a>
                    <a href="" icon-off="ion-ios-search" icon-on="ion-ios-search-strong" ng-click="goTo('index.search')"></a>
                    </ion-scroll>
                </div>
            </div>
            <ion-slide-box show-pager="true" on-slide-changed="slideHasChanged($index)">
                <ion-slide>    
                                            
                    <ion-tabs class="tabs-color-active-positive">
                        <ion-tab title="Trending" href="#/trending">
                            <ion-nav-view name="index-trending"></ion-nav-view>
                        </ion-tab>
                        <ion-tab title="Feeds" href="#/feeds">
                            <ion-nav-view name="index-feeds"></ion-nav-view>
                        </ion-tab>
                    </ion-tabs>    
                    
                </ion-slide>
                <ion-slide>
                    <ion-nav-view name="index-collections"></ion-nav-view>
                </ion-slide>                
                <ion-slide>
                    <ion-nav-view name="index-chats"></ion-nav-view>
                </ion-slide>
                <ion-slide>
                    <ion-nav-view name="index-account"></ion-nav-view>
                </ion-slide>                
                <ion-slide>
                    <ion-nav-view name="index-search"></ion-nav-view>
                </ion-slide>
            </ion-slide-box>
      </tab-slide-box>

Also I have hosted the source on my website for a tester / UI designer. The browser renders IOS view by default. Can we change this to render an android?

2

hi, may i ask you ?

we look almost the same layout, and my implementation use with github too.

i want to each include from a different file, how to make it?
Can you help me?
Thanks