【问题标题】:Cant hide Ionic Tab first不能先隐藏离子标签
【发布时间】:2018-06-11 20:40:30
【问题描述】:

我正在尝试创建Ionic-3 Tab 选项,它工作正常,但我的问题是我不想在选项卡菜单中显示第一个选项卡,但我想在第一次页面的页面详细信息中显示第一个选项卡菜单打开,我试图隐藏第一个标签,但它对我不起作用,有人知道该怎么做吗?我在我的问题上附上了一些图片以帮助您理解它。

Tabs.html

<ion-tabs>
  <ion-tab [root]="tab0Root"></ion-tab>
  <ion-tab [root]="tab1Root" tabTitle="Check-In" tabIcon="people"></ion-tab>
  <ion-tab [root]="tab2Root" tabTitle="Observations" tabIcon="information-circle"></ion-tab>
  <ion-tab [root]="tab3Root" tabTitle="Activities" tabIcon="book"></ion-tab>
  <ion-tab [root]="tab4Root" tabTitle="Health" tabIcon="medkit"></ion-tab>
</ion-tabs>

Tabs.ts

import { Component } from '@angular/core';

import { AboutPage } from '../about/about';
import { ContactPage } from '../contact/contact';
import { HomePage } from '../home/home';
import {HealthPage} from '../health/health';
import {MainPage} from '../main/main';


@Component({
  templateUrl: 'tabs.html'
})
export class TabsPage {
  tab0Root = MainPage;
  tab1Root = HomePage;
  tab2Root = AboutPage;
  tab3Root = ContactPage;
  tab4Root = HealthPage;
  constructor() {

  }
}

【问题讨论】:

  • 只需在tabs.scss中通过css隐藏它,然后在您想要的页面中再次显示
  • @Duannx 先生,你能把它放在你的答案中
  • that 是你想要的吗?标签Home 显示在HomePageMenuPage 中,但隐藏在ContactPage
  • 我想隐藏tab0Root按钮,但我想在应用打开时显示tab0Root详细信息
  • stackblitz.com/edit/ionic-8jmimp这就是你想要的吗?

标签: ionic-framework ionic3 ionic-tabs


【解决方案1】:

每个Tab 都有自己的show 属性。因此,如果您想隐藏它,只需将其更改为 false
tabs.ts:

import { Component, ViewChild } from '@angular/core';
import { Tabs } from 'ionic-angular';
@ViewChild(Tabs) tabs: Tabs;
ionViewDidEnter(){ 
    this.tabs.getByIndex(0).show = false; 
}

【讨论】:

  • 先生,感谢您的解决方案和您的时间
  • 先生我有一些错误,为什么会得到这个:(`TypeError: _co.tabChange is not a function`
  • 对不起先生这是我的错误我删除了这个(ionChange)="tabChange($event)"现在它的工作
【解决方案2】:

代码端:

tab0Root = MainPage;
public isVisibleFirstTab : boolean = false;

标记:

<ion-tab *ngIf="isVisibleFirstTab" [root]="tab0Root"></ion-tab>

[rootParams] 可用于*ngIf 条件

【讨论】:

  • 先生,我现在试试,不行,第一个选项卡菜单被隐藏但不显示在该选项卡菜单中,详细信息是页面打开,
  • 这是我的代码export class TabsPage { tab0Root = MainPage; tab1Root = HomePage; tab2Root = AboutPage; tab3Root = ContactPage; tab4Root = HealthPage; public isVisibleFirstTab : boolean = false; constructor() { }
  • &lt;ion-tabs&gt; &lt;ion-tab *ngIf="isVisibleFirstTab" [root]="tab0Root"&gt;&lt;/ion-tab&gt; &lt;/ion-tabs&gt;
猜你喜欢
  • 2015-05-09
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2021-11-11
  • 2015-03-30
  • 1970-01-01
相关资源
最近更新 更多