Как загрузить другую страницу внутри ионного сегмента? - PullRequest
Новая
       1

Как загрузить другую страницу внутри ионного сегмента?

0 голосов
/ 02 июня 2019

Кто-нибудь знает, как загрузить другую страницу внутри ion-сегмента. Я использую ионный V4 У меня есть три страницы, которые я пытаюсь отобразить внутри ионных сегментов (профиль, вакцинация, развитие). Я хочу сохранить функциональность страниц отдельно для удобства сопровождения.

Вот страница детского интереса

childdetails.page.html 

<ion-content padding>
    <ion-toolbar>
      <ion-segment (ionChange)="segmentChanged($event)" [(ngModel)]="segment" color="warning">
        <ion-segment-button value="profile" (ionSelect)="goToProfilePage()">
         Profile
        </ion-segment-button>
        <ion-segment-button value="vaccination">
          Vaccination
        </ion-segment-button>
        <ion-segment-button value="development">
          Development
        </ion-segment-button>
      </ion-segment>
    </ion-toolbar>

    <div [ngSwitch]="segment">
        <ion-list *ngSwitchCase="'profile'">
          <<**I would like to include addchild.html here**>>
        </ion-list>
</div>
</ion-content>

childdetails.page.ts 

import { Component, OnInit, ViewChild } from '@angular/core';

@Component({
  selector: 'app-childdetails',
  templateUrl: './childdetails.page.html',
  styleUrls: ['./childdetails.page.scss'],
})
export class ChilddetailsPage implements OnInit {
/** 
  segment = 0;
  */
  segment: string = "vaccination";
  constructor() {}

  ngOnInit() {
  }

  async segmentChanged() {
    this.segment}

}

Я не хочу, чтобы содержимое загружалось с той же страницы, которая содержит сегмент, как показано ниже. так как каждый из них будет около 150-200 строк кода. лучше хранить их на отдельных страницах. 

<div [ngSwitch]="segment">
        <ion-list *ngSwitchCase="'profile'">
          <p> I dont want it to be like this </p>
        </ion-list>
</div>

Кто-нибудь знает, как это сделать? Заранее спасибо

...