如何根据是否使用 defaultHref 获得条件离子后退按钮文本？

Question

我有一个要显示文本的按钮，但仅当使用 defaultHref 时才显示。有办法检测吗？

<ion-back-button *ngIf="defaultHref" [defaultHref]="defaultHref" [text]="text" icon="ios-arrow-back" mode="md"></ion-back-button>

如果后退按钮显示为不同路由器转发的结果，后退按钮 link 会转到其他地方，但我设置的文本仍然存在。有没有办法使该文本以 link 匹配我设置的 defaultHref 为条件？

Answer 1

根据一些调查，the component itself doesn't know如果它可以返回直到它尝试返回：

  private onClick = async (ev: Event) => {
    const nav = this.el.closest('ion-nav');
    ev.preventDefault();

    if (nav && await nav.canGoBack()) {
      return nav.pop({ skipIfBusy: true });
    }
    return openURL(this.defaultHref, ev, 'back');
  }

这仍然是可能的，因为您可以模仿它，并检查应用程序是否可以返回您用于设置文本的逻辑。

Page.html:

<ion-buttons slot="start">
  <ion-back-button defaultHref="/custom-back-button" [text]="getCustomText()"></ion-back-button>
</ion-buttons>

Page.ts:

  constructor(
    private ionRouterOutlet: IonRouterOutlet
  ) { }

  getCustomText():string {
    if(this.ionRouterOutlet.canGoBack()) {
      return "Can Go Back Text";
    } else {
      return "Can Only Go To Default";
    }
  }

直接导航时显示：

当它有一个历史可以追溯到：

如何根据是否使用 defaultHref 获得条件离子后退按钮文本？

How can I have conditional ion-back-button text based on if the defaultHref is used?

ionic-framework

angular

ionic4