【问题标题】:Ion-nav-bar for a view用于查看的离子导航栏
【发布时间】:2017-08-31 05:56:17
【问题描述】:

我正在从事 Ionic 1 项目。我试图在其中一个视图中有一个带有后退按钮的导航栏,但它没有出现。我在 Chrome 上进行了检查,发现后退按钮的类变成了hide。反正我可以让它出现吗?

这是我的代码:

<ion-view ng-controller="GuDetailCtrl">
 <ion-nav-bar class="bar-positive">
<ion-nav-back-button class="button-icon ion-arrow-left-c show">
</ion-nav-back-button>
 </ion-nav-bar>
 <ion-content class="padding">
<div class="list">
  <label class="item item-input">
    <span class="input-label">Name</span>
    <span>{{hotel.name}}</span>
  </label>
  <label class="item item-input">
    <span class="input-label">Locality</span>
    <span>{{hotel.locality}}</span>
  </label>
  <label class="item item-input">
    <span class="input-label">Amenities</span>
    <span>{{hotel.amenities}}</span>
  </label>
</div>
<button class="button button-positive" ng-click="modal.show()">
  Create Booking
</button>

<script id="templates/booking.html" type="text/ng-template">
  <ion-modal-view>
    <ion-header-bar class="bar bar-header bar-positive">
      <h1 class="title">New Booking</h1>
      <button class="button button-clear button-primary" ng-click="modal.hide()">Cancel</button>
    </ion-header-bar>
    <ion-content class="padding">
      <div class="list">
        <label class="item item-input">
          <span class="input-label">Check-in Date</span>
          <input ng-model="newBooking.inDate" type="date">
        </label>
        <label class="item item-input">
          <span class="input-label">Check-out Date</span>
          <input ng-model="newBooking.outDate" type="date">
        </label>
        <label class="item item-input">
          <span class="input-label">No. of Rooms</span>
          <input ng-model="newBooking.rooms" type="number">
        </label>
        <button class="button button-full button-positive" ng-click="createBooking(newBooking)">Create</button>
      </div>
    </ion-content>
  </ion-modal-view>
</script>

 </ion-content>
</ion-view>

【问题讨论】:

    标签: ionic-framework


    【解决方案1】:

    你可以试试这个代码。默认情况下,标题有一个类,如果你没有明确指定一个,那么后退按钮将不会出现。您可以在课堂上使用 bar-lightbar-royal

    <ion-nav-bar class="bar-royal">
        <ion-nav-back-button>Back</ion-nav-back-button>
    </ion-nav-bar>
    

    更多,你可以看here

    【讨论】:

    • 此页面是从另一个页面导航到的。父页面没有导航栏,所以我不能有一个通用的导航栏类。我尝试在我的代码中使用bar-royal。颜色变了,但后退按钮仍然没有出现。
    • 好的,我想你需要看看这个link希望它对你有帮助。
    • 很高兴您得到了解决方案。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2014-12-07
    • 1970-01-01
    • 2019-02-06
    • 1970-01-01
    • 2019-01-06
    • 2016-02-11
    相关资源
    最近更新 更多