Ionic2 - вкладки исчезают всякий раз, когда я нажимаю на новую страницу/компонент с navCtrl

Question

Согласно моему пониманию документы Ионные и такие вопросы, как: How to keep tab when pushing a new page?

Я правильно сделал, что необходимо, чтобы предотвратить мои ушки бар от прячась , Чтобы быть ясным, панель вкладок правильно показывает, когда навигация начинается с любой закладки, и вы переходите на любую другую вкладку в стеке. Всякий раз, когда вы используете метод «push» от навигационного контроллера или модального контроллера и т. Д. Панель вкладок исчезает. Где я иду не так?

В приведенном ниже кодеке человек приступает к пошаговому руководству при первой загрузке приложения. Существует кнопка, которая затем переносит их в каталог, в котором также должна находиться панель вкладок.

В случае, когда пользователь уже просмотрел прохождение, корневая страница устанавливается на домашнюю страницу, где существует панель вкладок. Если пользователь переходит к странице каталога с домашней страницы, используя панель вкладок, панель вкладок остается на месте, правильно в нижней части страницы.

По моему мнению, добавление вкладокHideOnSubPages: false для приложения.module.ts предотвратит это поведение, но это не так.

app.module.ts ...

imports: [ 
    IonicModule.forRoot(MyApp, { 
     tabsHideOnSubPages:false 
    }) 
] 

...

app.component.ts ...

import { Tabs } from '../pages/tabs/tabs'; 
import { Walkthrough } from '../pages/walkthrough/walkthrough'; 
@Component({ 
    templateUrl: 'app.html' 
}) 

export class MyApp { 
    rootPage: any = Tabs; 
    launchObject:any; 
    constructor(private platform: Platform){ 
    platform.ready().then(() => { 
     if(justDownloadedApp){ 
     this.rootPage = Walkthrough; 
     } 
    }) 
    } 
} 

...

app.component.html

<ion-nav [root]="rootPage"></ion-nav> 

tabs.ts

import { Component } from '@angular/core'; 
import { Home } from '../home/home'; 
import { Directory } from '../directory/directory'; 

@Component({ 
    templateUrl: 'tabs.html' 
}) 
export class Tabs { 
    tab1Root: any = Home; 
    tab2Root: any = Directory; 
    constructor(){} 
} 

tabs.html

<ion-tabs> 
    <ion-tab [root]="tab1Root" tabsHideOnSubPages="false" tabTitle="Spotlight" tabIcon="flash"></ion-tab> 
    <ion-tab [root]="tab2Root" tabsHideOnSubPages="false" tabTitle="Stores" tabIcon="cart"></ion-tab> 
</ion-tabs> 

walkthrough.ts

import { Component } from '@angular/core'; 
import { NavController } from 'ionic-angular'; 
import { Directory } from '../directory/directory'; 

@Component({ 
    selector: 'walkthrough', 
    templateUrl: 'walkthrough.html' 
}) 
export class Walkthrough { 
    constructor(public navCtrl: NavController){} 

    toDirectory(): any{ 
    this.navCtrl.push(Directory); 
    } 
} 

walkthrough.html

<ion-header class="opaque"></ion-header> 
<ion-content class="walkthroughBackground"> 
    <ion-col> 
     <ion-row> 
      <button class="clear-button-two" (click)="toDirectory()">Directory</button> 
     </ion-row> 
    <ion-col> 
</ion-content> 

Answer 1

Это ожидаемое поведение. tabsHideOnSubPages:false - это поведение по умолчанию. Это не проблема. Когда вы this.navCtrl.push(Directory); он приходит сверху WalkThrough компонента. Directory не знает о вкладках.

Только страница Tabs и ее дети будут знать о вкладках. Здесь вы не нажали Tabs в NavController. Итак, массив nav выглядит так: [WalkThrough,Directory]. Вместо этого вам нужно [WalkThrough, Tabs(default: Directory)].

Вам нужно нажать кнопку Tabs и установить <ion-tabs selectedIndex="1">. Вы можете использовать navParams, чтобы пройти, какой индекс нужно выбрать. Вот макет.

прохождение.TS ->this.navCtrl.push(Tabs,{index: "1"});

tabs.ts ->index = navParams.get('index')

tabs.html -><ion-tabs selectedIndex= {{index}} >

Я нету тестировал. Надеюсь, это сработает для вас.