我有一个基于super template的离子3应用程序。我已将根页面设置为以下内容:
<ion-tabs>
<ion-tab [root]="tab1Root" [tabTitle]="tab1Title" tabIcon="bonfire"></ion-tab>
<ion-tab [root]="tab2Root" [tabTitle]="tab2Title" tabIcon="search"></ion-tab>
<ion-tab [root]="tab3Root" [tabTitle]="tab3Title" tabIcon="cog"></ion-tab>
</ion-tabs>
当我按下此页面上的硬件后退按钮时,根本没有任何反应。但是,当我将内容更改为其他内容时,例如:
<p>Hello</p>
然后按照我的意愿退出硬件后退按钮。
如何在选项卡页面上使硬件返回按钮正常工作,同时保留其他页面上的工作默认行为?
答案 0 :(得分:5)
在app.component.ts
文件中
import { Nav, App } from 'ionic-angular';
export class MyApp {
@ViewChild(Nav) nav: Nav;
然后
platform.registerBackButtonAction(() => {
let nav = app.getActiveNav();
let activeView: ViewController = nav.getActive();
if(activeView != null){
if(nav.canGoBack()) {
nav.pop();
}else if (typeof activeView.instance.backButtonAction === 'function')
{
activeView.instance.backButtonAction();
}
else {
nav.parent.select(0); // goes to the first tab
}
}
});
希望这对您有所帮助,也不要忘记将它放在平台内。
在你需要关闭应用程序的respcted ts文件中写一个函数
backButtonAction(){
this.platfrom.exitApp();
}
答案 1 :(得分:1)
我最终需要在app.container.ts
中执行此操作才能获得所需的行为:
platform.registerBackButtonAction(() => {
let nav = app.getActiveNav();
let activeView = nav.getActive();
if (activeView != null){
if (nav.canGoBack()) {
nav.pop();
} else if (nav.parent.getSelected() != nav.parent.getByIndex(0)) {
// goes to the first tab
nav.parent.select(0);
} else {
platform.exitApp();
}
}
});
答案 2 :(得分:0)
在您的标签页中尝试添加ionViewDidEnter
并尝试按以下方式附加以下类:
ionViewDidEnter() {
this.platform.registerBackButtonAction(() => {
this.platform.exitApp();
});
}
答案 3 :(得分:0)
在 构造函数() 中编写代码,从哪个页面离开。
<强> Home.ts 强>
constructor(
public navCtrl: NavController,
private platform: Platform) {
this.platform.registerBackButtonAction(()=>{
this.platform.exitApp();
});
}