我们正在构建一个包含三个选项卡的模板.这些选项卡应该像这个例子一样工作:
https://getbootstrap.com/javascript/#tabs-examples
我们只想切换选项卡中的内容.如果不需要新模板,我们怎么做呢?
我们的详细模板是这样的:
<ion-view view-title="{{item.summary.name}}"> <ion-nav-buttons side="left"> <button class="button button-icon button-clear ion-navicon" menu-toggle="left"></button> </ion-nav-buttons> <div class="bar bar-subheader bar-assertive"> <ion-tabs class="tabs-background-assertive tabs-color-light"> <ion-tab title="Summary"> <ion-nav-view name="summary" ></ion-nav-view> </ion-tab> <ion-tab title="Ingridents"> <ion-nav-view name="ingdts"></ion-nav-view> </ion-tab> <ion-tab title="Videos"> <ion-nav-view name="video"></ion-nav-view> </ion-tab> </ion-tabs> </div> </ion-view>
我们尝试了这个,@L_403_1@但它没有用.
解决方法
如果我理解正确,您可以将选项卡的离子内容包装在离子窗格中以使用静态选项卡:
<ion-tab title="Summary"> <ion-pane> <ion-content> <!-- Tab content here --> Summary content </ion-content> </ion-pane> </ion-tab>
这是一个codepen example