如何在Ionic 3段布局中插入页面 [英] How can i insert page in ionic 3 segment layout

问题描述

This is my app with Tabs layout

一旦我单击轮廓"选项卡，我将推入一个名为"Profile.ts"的页面，该页面在其自己的模板Profile.html中包含离子段.

Once i click on profile tab i push a page say Profile.ts which contains ion-segment in its own template Profile.html

Profile.html

Profile.html

<ion-content>
  <ion-segment [(ngModel)]="whichPage" color="primary">
  <ion-segment-button style="font-size: 11px" value="Personal">
    Personal
  </ion-segment-button>
</ion-segment>

<div [ngSwitch]="whichPage">
 <ion-list *ngSwitchCase="'Personal'">
 <ion-item>
   **HERE HOW CAN I DISPLAY ANOTHER PAGE WHICH I HAVE CREATED USING IONIC 
   GENERATE PAGE Personal**
 </ion-item>
</div>
</ion-content>

推荐答案

您将无法显示整个页面，但可以设置一个组件.这是因为特定页面只能具有一个ion-content标记.

You wont be able to display an entire page but you can set a component. This is because a particular page can only have one ion-content tag.

您将必须从配置文件中删除页眉，页脚和内容父标签. 您可以在Profile.html中包含配置文件内容.然后在您的细分受众群中将其用作子组件，如下所示:

You will have to remove the header, footer and content parent tags from profile. You can have the profile content within Profile.html. and then use it within your segment as a Child component as:

<ion-list *ngSwitchCase="'Personal'">
 <ion-item>
   <PersonalComponent></PersonalComponent>
 </ion-item>
</ion-list>

这篇关于如何在Ionic 3段布局中插入页面的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！