Ionic导航后退按钮没有显示

Ionic nav-back-button not showing up

本文关键字：显示 按钮 导航 Ionic      更新时间：2023-09-26

我是Ionic的新手，我目前正在尝试制作自己的应用程序，这是由几个选项卡构建的。我目前面临的问题是，我的后退按钮不显示。在我的事件选项卡中，我允许人们单击列表中的事件，该列表将打开一个带有该特定事件详细信息页面的href (event.html)。我的问题是，后退按钮不会显示在任何视图。我甚至尝试了简单的方法，用导航栏和后退按钮创建一个空白的新视图，但它仍然没有显示出来。谁能告诉我该怎么做才能让后退按钮显示出来?

非常感谢!

index . html: 

<body ng-app="App">
<ion-nav-bar class="bar-positive">
<ion-nav-back-button class="button-icon button-clear">
    <i class="icon ion-arrow-left"></i> Back
</ion-nav-back-button>
</ion-nav-bar>
<ion-nav-view>
</ion-nav-view>

选项卡:

<ion-tabs class="tabs-icon-top">
    <ion-tab title="Events" icon="ion-calendar" ui-sref="tabs.events">
        <ion-nav-view name="events-tab"></ion-nav-view>
    </ion-tab>
</ion-tabs>

app.js: 

.state('tabs.events', {
    url: '/events',
    views: {
      'events-tab': {
        templateUrl: 'views/events/events.html',
        controller: 'EventsController'
      }
    }
  }).state('event', {
    url: '/event/:id',
    templateUrl: 'views/events/event.html',
    controller: 'EventController'
  });

events.html(链接到详情页)

<a href="#/event/{{event.id}}">

event.html: 

<ion-view view-title="{{event.title}}">
<ion-content>
    Event title: {{event.title}} <br />
    Group name: {{event.groupname}} <br />
    Date: {{event.date}} <br />
    Description: {{event.description}} <br />
</ion-content>
</ion-view>

添加到你想返回的控制器

$scope.$on('$ionicView.beforeEnter', function (event, viewData) {
    viewData.enableBack = true;
});

我也面临着同样的问题，但后来我在我想要使用的地方使用了自定义箭头。你可以添加自定义箭头图像到你的CSS文件，然后可以使用相应的。ng-click="goBack()"用于导航到你想去的页面，你可以在你的.js文件中定义它。我希望这行得通

HTML文件

<ion-nav-buttons side="left">
    <a ng-click="goBack()" class="button back-button buttons  button-clear header-item nav-back-btn">
        <i class="ion-android-arrow-back" id="customArrow"></i>
    </a>
</ion-nav-buttons>
相关文章：