export class TabsPage {
navigationProccess:Array<any> = [];
lastTabName:string = "";
currentBack:string = "";
constructor(private platform: Platform,private router:Router,private navctrl:NavController) {
this.router.events.subscribe((event:RouterEvent)=>{
if(event.url !== undefined){
if(this.lastTabName !== event.url && event.url !== this.currentBack){
// we put last tab name not equal event.url so the event don't go twice through array
// we put event.url not equal current back that is since when navcontroll in back button go back its considered a router event and we don't need it to be inserted again
this.pushTabHistory(event.url);
}
this.lastTabName = event.url;
}
});
this.platform.backButton.subscribeWithPriority(99999999,async()=>{
let pushHistoryCount = this.navigationProccess.length;
if(this.router.url.includes('tabs') == true && pushHistoryCount > 1){
let url = this.navigationProccess[pushHistoryCount-2].url;
this.navigationProccess.splice(pushHistoryCount-1, 1);
this.currentBack = url;
//currentBack should be assigned before navgiate back
this.navctrl.navigateBack(url);
}
})
}
pushTabHistory(tabName:string){
let navHistory = {
url:tabName
};
this.navigationProccess.push(navHistory)
}
}
Мате, я отредактировал свой ответ, и ты прав. Вкладки не имеют routeroutlet.cangoBack (), поскольку вкладки и tabs / tab1ortab2ortab3 считаются одним уровнем и не могут go назад. Здесь я создал способ создания истории навигации внутри массива и go назад и вперед из этого массива, но подписка назад осуществляется со страницы вкладок, и я делаю это так, поскольку вы можете сделать это только для тестирования.
Но В качестве продвинутого способа мы go -> 1) Создаем вкладку службы:
import { Injectable } from '@angular/core';
@Injectable({
providedIn: 'root'
})
export class TabnavService {
public navigationProccess:Array<any> = [];
public lastTabName:string = "";
public currentBack:string = "";
constructor() { }
pushTabHistory(tabName:string){
let navHistory = {
url:tabName
};
this.navigationProccess.push(navHistory)
}
}
2) Внутри ваших вкладокСтраница:
import { TabnavService } from './../services/tabnav.service';
import { Router, RouterEvent } from '@angular/router';
import { Component } from '@angular/core';
import { NavController, Platform } from '@ionic/angular';
@Component({
selector: 'app-tabs',
templateUrl: 'tabs.page.html',
styleUrls: ['tabs.page.scss']
})
export class TabsPage {
constructor(private platform: Platform,
private router:Router,
private tabNavService:TabnavService) {
if(this.platform.is('android')){
this.router.events.subscribe((event:RouterEvent)=>{
if(event.url !== undefined){
if(this.tabNavService.lastTabName !== event.url && event.url !== this.tabNavService.currentBack){
// we put last tab name not equal event.url so the event don't go twice through array
// we put event.url not equal current back that is since when navcontroll in back button go back its considered a router event and we don't need it to be inserted again
this.tabNavService.pushTabHistory(event.url);
}
this.tabNavService.lastTabName = event.url;
}
});
}
}
}
3) В app.component.ts :
import { TabnavService } from './services/tabnav.service';
import { Component, ViewChild } from '@angular/core';
import { Platform, IonRouterOutlet, NavController } from '@ionic/angular';
import { SplashScreen } from '@ionic-native/splash-screen/ngx';
import { StatusBar } from '@ionic-native/status-bar/ngx';
import { Router } from '@angular/router';
@Component({
selector: 'app-root',
templateUrl: 'app.component.html',
styleUrls: ['app.component.scss']
})
export class AppComponent {
@ViewChild(IonRouterOutlet,{static:false}) routerOutlet:IonRouterOutlet;
constructor(
private platform: Platform,
private splashScreen: SplashScreen,
private statusBar: StatusBar,
private router:Router,
private navctrl:NavController,
private tabNavService:TabnavService
) {
this.initializeApp();
}
initializeApp() {
this.platform.ready().then(() => {
this.statusBar.styleDefault();
this.splashScreen.hide();
this.platform.backButton.subscribeWithPriority(99999999,async()=>{
let pushHistoryCount = this.tabNavService.navigationProccess.length;
if(this.router.url.includes('tabs') == true && pushHistoryCount > 1){
let url = this.tabNavService.navigationProccess[pushHistoryCount-2].url;
this.tabNavService.navigationProccess.splice(pushHistoryCount-1, 1);
this.tabNavService.currentBack = url;
//currentBack should be assigned before navgiate back
this.navctrl.navigateBack(url);
}else if(this.router.url.includes('tabs') == true && pushHistoryCount <2){
// here is the array less than 2 which is one (you could make it ==0 but i make it if app glitches or something)
//so if app is on main start point it exit on back pressed
navigator['app'].exitApp();
}
});
});
}
}
И это все ^ ^. Любая помощь Просто прокомментируйте здесь снова * ^.