<ion-header>

  <ion-navbar>

    <button menuToggle (click)="doclick()">

      <ion-icon name="menu"></ion-icon>

    </button>

    <ion-title>Home</ion-title>

  </ion-navbar>

  <ion-toolbar no-border-top>

    <ion-segment [(ngModel)]="pet">

      <ion-segment-button value="friends">

        Friends

      </ion-segment-button>

      <ion-segment-button value="puppies">

        Puppies

      </ion-segment-button>

      <ion-segment-button value="kittens">

        Kittens

      </ion-segment-button>

      <ion-segment-button value="ducklings">

        Ducklings

      </ion-segment-button>

    </ion-segment>

  </ion-toolbar>

</ion-header>

<ion-content padding class="home">

  <div [ngSwitch]="pet">

    <ion-list *ngSwitchCase="'friends'">

      <ion-card>

        <ion-item>

          <ion-avatar item-left>

            <img src="../imb/2.jpg">

          </ion-avatar>

          <h3>一曲丶终了</h3>

          <p>一加A0001</p>

        </ion-item>

        <ion-card-content>

          <p>扶我起来，我还能送!</p>

        </ion-card-content>

        <img src="../images/content/01.png" alt="" />

        <ion-item>

          <button primary clear item-left>

            <ion-icon name="thumbs-up"></ion-icon>

            <div>10赞</div>

          </button>

          <button primary clear item-left>

            <ion-icon name="text"></ion-icon>

            <div>15评论</div>

          </button>

          <ion-note item-right>

            30分钟之前

          </ion-note>

        </ion-item>

      </ion-card>

      <ion-card>

        <ion-item>

          <ion-avatar item-left>

            <img src="../images/3.jpg">

          </ion-avatar>

          <h3>Seven</h3>

          <p>小米 4 LTE</p>

        </ion-item>

        <ion-card-content>

          <p>可不可以不勇敢!</p>

        </ion-card-content>

        <img src="../images/content/05.png" alt="">

        <ion-item>

          <button primary clear item-left>

            <ion-icon name="thumbs-up"></ion-icon>

            <div>10赞</div>

          </button>

          <button primary clear item-left>

            <ion-icon name="text"></ion-icon>

            <div>15评论</div>

          </button>

          <ion-note item-right>

            2小时之前

          </ion-note>

        </ion-item>

      </ion-card>

    </ion-list>

    <ion-list *ngSwitchCase="'puppies'">

      <ion-item>

        <ion-thumbnail item-left>

          <img src="assets/img/thumbnail-puppy-1.jpg">

        </ion-thumbnail>

        <h2>Ruby</h2>

      </ion-item>

      <ion-item>

        <ion-thumbnail item-left>

          <img src="assets/img/thumbnail-puppy-2.jpg">

        </ion-thumbnail>

        <h2>Oscar</h2>

      </ion-item>

      <ion-item>

        <ion-thumbnail item-left>

          <img src="assets/img/thumbnail-puppy-4.jpg">

        </ion-thumbnail>

        <h2>Zoey</h2>

      </ion-item>

      <ion-item>

        <ion-thumbnail item-left>

          <img src="assets/img/thumbnail-puppy-3.jpg">

        </ion-thumbnail>

        <h2>Otto</h2>

      </ion-item>

    </ion-list>

    <ion-list *ngSwitchCase="'kittens'">

      <ion-item>

        <ion-thumbnail item-left>

          <img src="assets/img/thumbnail-kitten-1.jpg">

        </ion-thumbnail>

        <h2>Luna</h2>

      </ion-item>

      <ion-item>

        <ion-thumbnail item-left>

          <img src="assets/img/thumbnail-kitten-3.jpg">

        </ion-thumbnail>

        <h2>Milo</h2>

      </ion-item>

      <ion-item>

        <ion-thumbnail item-left>

          <img src="assets/img/thumbnail-kitten-4.jpg">

        </ion-thumbnail>

        <h2>Bandit</h2>

      </ion-item>

      <ion-item>

        <ion-thumbnail item-left>

          <img src="assets/img/thumbnail-kitten-2.jpg">

        </ion-thumbnail>

        <h2>Nala</h2>

      </ion-item>

    </ion-list>

  </div>

</ion-content>

<!--menu-->

<ion-menu [content]="mycontent">

  <ion-header>

    <ion-toolbar>

      <ion-title>title</ion-title>

    </ion-toolbar>

  </ion-header>

  <ion-content>

    <ion-list>

      <ion-item>

      1

      </ion-item>

      <ion-item>

      2

      </ion-item>

      <ion-item>

      3

      </ion-item>

    </ion-list>

  </ion-content>

</ion-menu>

<ion-nav #mycontent [root]="rootPage"></ion-nav>

TS部分

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

import { NavController, MenuController, ModalController } from 'ionic-angular';

import { Menu } from '../contact/menu';

@Component({

  templateUrl: 'build/pages/contact/contact.html'

})

export class ContactPage {

  constructor(public navCtrl: NavController,public menuCtrl: MenuController,public modalCtrl: ModalController) {

  }

  doclick() {

this.menuCtrl.toggle();

}

}