【问题标题】:Back navigation button not showing up后退导航按钮不显示
【发布时间】:2017-11-06 02:37:23
【问题描述】:

我使用

克隆了代码

ionic 启动 myProjectName 教程

并根据 ionic 3 更改了项目,现在,有一个文件 list.html ,它在标题处有一个打开侧菜单的按钮。我想在那里有一个后退按钮,并删除了侧面菜单打开的代码。预计返回按钮会自动显示,但它没有发生,而是显示没有任何按钮的标题。

在这个项目中,你会找到 list.html ,我做了如下修改:

  <ion-header>
  <ion-navbar>
    <ion-title>My First List</ion-title>
  </ion-navbar>
</ion-header>
<ion-content>
  <ion-list>
    <button ion-item *ngFor="let item of items" (click)="itemTapped($event, item)">
      <ion-icon name="{{item.icon}}" item-left></ion-icon>
      {{item.title}}
      <div class="item-note" item-right>
        {{item.note}}
      </div>
    </button>
  </ion-list>
</ion-content>

它只有一个标题,没有可以带我到根页面的返回导航按钮

【问题讨论】:

    标签: ionic-framework ionic2 ionic3


    【解决方案1】:

    这里有一些 ionic 中的标头代码。

    <ion-view>
    <ion-nav-bar>
        <ion-nav-buttons side="left">
            <button class="button button-clear  ion-arrow-left-c  " ng-click="backButton()"></button>
        </ion-nav-buttons>
        <ion-nav-buttons side="right">
            <button class="button button-clear btn-white ion-android-settings header-icon-size " ng-click="openDrawer()"></button>
        </ion-nav-buttons>
    </ion-nav-bar>
    <ion-content>
        <!-- here content -->
    </ion-content>
    </ion-view>
    

    让我知道它是否适合您?

    【讨论】:

    • 您提供的代码是正确的,但这是不可行的,因为手动调用后退按钮上的函数会使我回到它顶部的上一页,IONIC 2 提供了默认的后退按钮,它可以工作轻松
    【解决方案2】:

    您可以在 app.component.ts 中添加以下代码

    itemTapped(item) {
        // close the menu when clicking a link from the menu
        this.menu.close();
        // navigate to the new page if it is not the current page
        this.nav.push(page.component);
     }
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2014-02-16
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多