Linking to another page from components

I am very new to Ionic. I have a simple code like this:

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

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

  <ion-content>
    <ion-list *ngFor="let item of menus">
      <button ion-item (click)="openPage(m)">
        {{item.title}}
        <ion-icon name="flask" item-right></ion-icon>
      </button>
      </ion-list><br />
  </ion-content>

</ion-menu>

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

and the Typescript:

import { Component, ViewChild} from '@angular/core';
import { ionicBootstrap, Platform, MenuController, Nav, NavParams} from 'ionic-angular';
import {StatusBar} from 'ionic-native';
import {ListPage} from '../list/list';
import {CalendarPage} from '../calendar/calendar';

@Component({
  templateUrl: 'build/pages/centers/centers.html',
})
export class CentersPage {
  @ViewChild(Nav) nav: Nav;

  rootPage: any = ListPage;
  menus: Array<{title: string, component: any}>;

  constructor(
    private platform: Platform,
    private menu: MenuController) {

    // set our app's pages
    this.menus = [
      { title: 'JPTS Centers', component: ListPage},
      { title: 'JPTS Calendar', component: CalendarPage}
    ];

  }

openPage(menus) {
    this.menu.close();
    this.nav.setRoot(menus.component);
  }

}

Now problem there is that I am unable to loop through the components, liking to another page just like I did for the title. I really need a help as soon as possible