如何在Ionic标签中呈现内容而不使用新模板，而仅通过像在Bootstrap中那样切换标签

Question

我们正在构建一个带有三个选项卡的模板。这些标签应该在此示例中起作用：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>

我们尝试了这个，/sf/answers/2205456431/，但是它不起作用。

Answer 1

如果我理解正确，您可以将ion-content选项卡的 包装在 a 中ion-pane以使用静态选项卡：

<ion-tab title="Summary">
  <ion-pane>
    <ion-content>
      <!-- Tab content here -->
      Summary content
    </ion-content>
  </ion-pane> 
</ion-tab>

这是一个代码笔示例