angularjs – 离子导航栏按钮 – 右侧

发布时间：2020-12-17 09:29:13 所属栏目：安全来源：网络整理

导读：我第一次开始使用Ionic.目前我有一个列表视图,当移动到列表中时,出现后退按钮. ion-nav-bar class="bar-stable nav-title-slide-ios7" ion-nav-back-button class="button-icon icon ion-ios7-arrow-back" Back /ion-nav-back-button/ion-nav-bar 如何在屏幕

我第一次开始使用Ionic.目前我有一个列表视图,当移动到列表中时,出现后退按钮.

<ion-nav-bar class="bar-stable nav-title-slide-ios7">
  <ion-nav-back-button class="button-icon icon  ion-ios7-arrow-back">
    Back
  </ion-nav-back-button>
</ion-nav-bar>

如何在屏幕右侧添加一个按钮,只有在移动到列表中时才会显示？

您可以使用< ion-header-bar align-title =“right”>

完全实施(左和右)(从docs)：

<ion-header-bar align-title="left" class="bar-positive">
  <div class="buttons">
    <button class="button" ng-click="doSomething()">Left Button</button>
  </div>
  <h1 class="title">Title!</h1>
  <div class="buttons">
    <button class="button">Right Button</button>
  </div>
</ion-header-bar>
<ion-content>
  Some content!
</ion-content>

正如Harry指出的那样,添加离子导航按钮并设置side = right是正确的方法.

(复制自@ harry的答案)

<ion-nav-bar class="bar-stable nav-title-slide-ios7">
    <ion-nav-back-button class="button-icon icon  ion-ios7-arrow-back">
        Back
    </ion-nav-back-button>
    <ion-nav-buttons side="right">
        <button class="button button-clear button-positive" ng-click="reset()">
            Refresh
        </button>
    </ion-nav-buttons>
</ion-nav-bar>

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!