离子4-防止在离子后退按钮上导航

时间:2019-06-25 13:11:23

标签: ionic-framework ionic4

有没有一种方法可以实现离子后退按钮而又不自动触发nav.pop()?

问题源于我不能简单地重制的有趣的自定义箭头后退按钮离子用法。

下面的代码段是最接近,最简单的方法,但是结果看起来并不“相同”。导航堆栈为空时,它不会自动隐藏。

<ion-button slot="start" (click)="onBack()" fill="clear">
    <ion-icon slot="icon-only" name="arrow-back" style="color:#424242"></ion-icon>
</ion-button>

我想要的是

<ion-back-button slot="start" (click)="someCustomLogic()"></ion-back-button>

2 个答案:

答案 0 :(得分:0)

为什么不尝试这样的事情:

<ion-row>
  <ion-col tap="someCustomLogic()">
    <ion-icon slot="icon-only" name="arrow-back" style="color:#424242"></ion-icon>
  </ion-col>
</ion-row>

答案 1 :(得分:0)

绝对是黑客:

<ion-toolbar>
    <ion-buttons slot="start">
      <ion-back-button onclick="event.stopImmediatePropagation(); window.myCustomMethod()"></ion-back-button>
    </ion-buttons>
    <ion-title>
      List
    </ion-title>
</ion-toolbar>

内部ts:

import { Component, OnInit } from '@angular/core';
import { NavController } from '@ionic/angular';

@Component({
  selector: 'app-list',
  templateUrl: 'list.page.html',
  styleUrls: ['list.page.scss']
})
export class ListPage {

  constructor( private navCtrl: NavController) {
    window['myCustomMethod'] = this.overide;
  }

  overide = () => {
    console.log("hi")
    this.navCtrl.navigateBack('/home')
  }

}