Question

我在子视图的标题下有一个标签导航，所以我写了下面的html：

<ion-header>

  <ion-navbar primary>
    <ion-title>Productos</ion-title>
  </ion-navbar>

</ion-header>

<ion-tabs tabsPlacement="top">
  <ion-tab tabTitle="Catalogo"></ion-tab>
  <ion-tab tabTitle="Pedido"></ion-tab>
</ion-tabs>

<ion-content padding>Foo !!</ion-content>

导航栏和＆＃34; Foo !!＆＃34;显示但不是标签。有什么想法吗？

Answer 1

我错了。离子标签必须有您自己的组件：

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

import { ProductCatalog } from './catalog.component';
import { ProductCart } from './cart.component';

@Component({
    templateUrl: 'tabs.html'
})

export class ProductTabs {

    catalog:any = ProductCatalog;
    cart:any = ProductCart;

    constructor() {}
}


<!-- tabs.html only tabs widget -->
<ion-tabs tabsPlacement="top">
  <ion-tab [root]="catalog" tabTitle="CATALOGO"></ion-tab>
  <ion-tab [root]="cart" tabTitle="CARRITO"></ion-tab>
</ion-tabs>

ProductCatalog和ProductCart是两个普通页面。

子视图选项卡不显示

1 个答案: