Ionic 4 Angular Back Button 到上一页而不是 root? [英] Ionic 4 Angular Back Button to previous page instead of root?

问题描述

我有一个带有 2 个选项卡和 1 个详细信息页面的小 Ionic 4 应用程序.我在这里面临的问题是，如果我从 Tab2 进入详细信息页面，然后从那里使用 ion-back-button 返回，它总是将我重定向到 Tab1 而不是我之前所在的 Tab2.

这是我的例子:

Tab2 Html:这里我有一个带有点击事件的简单离子项:

 <ion-item class="chat-item" (click)='openChat()' >

它调用 openChat 函数，其工作方式如下:

 openChat() {this.router.navigateByUrl('/chatdetail/:uid');}

现在它打开我的 Chatdetail 页面，我在其中放置了一个后退按钮，可以像这样返回:

 <离子工具栏><ion-buttons slot="start"><ion-back-button></ion-back-button></离子按钮><ion-title>chatdetail</ion-title></ion-toolbar></ion-header>

但是，当我单击此按钮时，它不会像在 Ionic3 中那样弹出"页面，而是将我定向到我的应用程序的根页面，即 Tab1.

有什么方法可以覆盖返回事件以转到我之前所在的页面吗?

解决方案

更新:

Ionic 团队已在 Ver: 4.3.0

旧

您需要像这样使用 defaultHref="/Tab2":

 <ion-back-button defaultHref="/Tab2"></ion-back-button>

<块引用>

没有历史记录时默认导航回的网址.

https://ionicframework.com/docs/api/back-button

如何转到上一页?

import { Location } from "@angular/common";

constructor(private location: Location) { }

myBackButton(){this.location.back();}

I have a little Ionic 4 App with 2 Tabs and 1 Detail Page. The Problem I'm facing here is that if I go from Tab2 into Detail Page and from there with ion-back-button back it always redirect me to Tab1 instead of Tab2 where I was before.

Here is my example:

Tab2 Html: Here I have a simple ion-item with a click event:

        <ion-item class="chat-item" (click)='openChat()' >

It calls the openChat funtion which works like this:

          openChat() {
            this.router.navigateByUrl('/chatdetail/:uid');
          }

Now it opens my Chatdetail Page in which I have placed a Back Button to navigate back like this:

    <ion-header>
      <ion-toolbar>
          <ion-buttons slot="start">
              <ion-back-button></ion-back-button>
           </ion-buttons>
        <ion-title>chatdetail</ion-title>
      </ion-toolbar>
    </ion-header>

But when I click this Button it doesn't just "pop" the page like it was in Ionic3 instead it directs me to the root page of my App which is Tab1.

Is there any way of overwriting that back event to go to the page I was before?

解决方案

Update:

Ionic team has fixed this on Ver: 4.3.0

Old

You need to use defaultHref="/Tab2" like so:

  <ion-back-button defaultHref="/Tab2"></ion-back-button>

The url to navigate back to by default when there is no history.

https://ionicframework.com/docs/api/back-button

How to go to the previous page?

import { Location } from "@angular/common";

constructor(private location: Location) { }

myBackButton(){
  this.location.back();
}

这篇关于Ionic 4 Angular Back Button 到上一页而不是 root?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！