将离子2中的标签放在不属于任何标签的组件中

Question

我想在页面中放置标签，其中没有任何标签将该页面作为其组件。

当我使用页面内选项卡的选择器标签时，它还会加载选项卡选择的组件。

tab.html

<ion-tabs selectedIndex="0" tabsHighlight="true" > 
  <ion-tab [root]="tab1Root" tabTitle="Component1" tabIcon="md-person"> </ion-tab>
  <ion-tab [root]="tab2Root" tabTitle="Component2" tabIcon="md-calendar"></ion-tab>
  <ion-tab [root]="tab3Root" tabTitle="Component3" tabIcon="md-camera"></ion-tab>
</ion-tabs>

tabcomponent.ts

import { Component } from '@angular/core';
import { component1,component2,component3 } from '../components';

@Component({
   selector:'custom_tabs',
   templateUrl: 'tab.html'
});

class tabs{
      tab1Root:any=component1;
      tab2Root:any=component2;
      tab3Root:any=component3;
      constructor(){

      }
}

现在假设我还有一个组件

的test.html

This text is not inside any tab.
<custom_tabs></custom_tabs>

testcomponent.ts

import { Component } from '@angular/core';
import { tab } from '../tabcomponent';

@Component({
   templateUrl: 'test.html'
});

class test{
      constructor(){}
}

此处tab1Root组件可见并涵盖test.html的实际内容。我正在寻找一种功能，如果我点击它就会显示tab1Root或任何标签组件。