앱이 간단하며 사이드 메뉴와 탭이 결합되어 있습니다. 나는 그것이 완벽하게 작동한다고 생각했지만 root page
으로 탐색 한 다음 브라우저 이전 버튼을 누르면 탐색 표시 줄이 이상하게 깜박입니다.루트 페이지에서 탭이있는 페이지로 돌아 오는 과정에서 이상한 깜박임이 발생합니다.
이 은 지금까지 점점 오전 output입니다.
Menu.ts
import { Component,ViewChild } from '@angular/core';
import { IonicPage, NavController, NavParams, Nav } from 'ionic-angular';
export interface PageInterface {
title: string;
pageName: string;
tabComponent?: any;
index?: number;
icon: string;
}
// Am I doing some mistakes in the following block?
@IonicPage({
})
@Component({
selector: 'page-menu',
templateUrl: 'menu.html'
})
export class MenuPage {
rootPage ="TabsPage";
@ViewChild(Nav) nav: Nav;
pages: PageInterface[]= [
{ title:'Tab 1', pageName: 'TabsPage', tabComponent: 'HomePage', index: 0, icon:'home' },
{ title:'Tab 2', pageName: 'TabsPage', tabComponent: 'SchedulePage', index: 1, icon:'timer' },
{ title:'Tab 3', pageName: 'TabsPage', tabComponent: 'CasesPage', index: 2, icon:'briefcase' },
{ title:'Non-Tab', pageName: 'SplashPage', icon:'information-circle' }
]
constructor(public navCtrl: NavController, public navParams: NavParams) {
}
openPage(page: PageInterface) {
let params = {};
if (page.index) {
params = { tabIndex: page.index};
}
if (this.nav.getActiveChildNavs().length && page.index != undefined) {
this.nav.getActiveChildNavs()[0].select(page.index);
console.log('Else executed umdefined');
} else {
// This is where I set new root page if it is not a tabbed page.
this.nav.setRoot(page.pageName, params).catch((err: any) => {
console.log(`Didn't set nav root: ${err}`);
});
}
}
isActive(page: PageInterface) {
let childNav = this.nav.getActiveChildNavs()[0];
if (childNav) {
if (childNav.getSelected() && childNav.getSelected().root === page.tabComponent) {
return 'primary';
}
return;
}
if (this.nav.getActive() && this.nav.getActive().name === page.pageName) {
return 'primary';
}
return;
}
ionViewDidLoad() {
console.log('MenuPage');
}
}
Tabs.ts
@IonicPage({
segment: 'page-tabs'
})
@Component({
templateUrl: 'tabs.html'
})
export class TabsPage {
tab1Root= 'HomePage';
tab2Root= 'SchedulePage';
tab3Root= 'CasesPage';
myIndex: number;
constructor(public navCtrl: NavController, public navParams: NavParams) {
}
}
에서 정보가 충분하지 않은 경우, 전체 프로젝트가 here 사용할 수 있습니다.
업데이트 나는 명확하게 설명 할 수는 없지만 당신은 당신이 문제가 탐색의 역사에서 보인다 아닌 탭에 탭 페이지에서 스위치로 프로젝트를 실행하고 URL을 관찰하려고합니다. 당신의 app.component.ts 파일에서
기기에서 테스트 해 보셨습니까? – ewizard
거기에'navCtrl' 대신'@ViewChild (Nav) nav : Nav;'를 사용하는 이유가 있습니까? – ewizard
@ewizard Ionic DevApp에서 테스트하여 깜박임이 발생합니다. Chrome과 동일합니다. –