2017-10-09 63 views
0

我能够建立sidemenu侧菜单项,但我不知道如何将它链接到不同的网页,请帮我看看这方面如何显示在离子3

这里是演示:https://stackblitz.com/edit/ionic-lkxqz6?file=pages%2Fhome%2Fhome.html

问题:我想显示的menu其是ProfilePagePostPage

<ion-header> 

</ion-header> 

<ion-content padding> 

<button ion-button menuToggle icon-only class="menuButton"> 
    <ion-icon name="menu"></ion-icon> 
</button> 

<ion-menu [content]="mycontent"> 
    <ion-content> 
    <ion-list> 
     <p>some menu content, could be list items</p> 
    </ion-list> 
    </ion-content> 
</ion-menu> 

<ion-nav #mycontent type="overlay"></ion-nav> 

</ion-content> 
的2 menus

这里是演示:https://stackblitz.com/edit/ionic-lkxqz6?file=pages%2Fhome%2Fhome.html

回答

1

可以使用NavController https://ionicframework.com/docs/api/navigation/NavController/

按钮的onClick在你的导航菜单,你可以使用NavContoller推页面。

第1步:注射导航控制器在组件

import { NavController } from 'ionic-angular'; 

class MyComponent { 
    constructor(public navCtrl: NavController) { 

    } 
} 

第2步:创建菜单中单击事件。

<ion-menu [content]="content"> 
    <ion-content> 
    <ion-list> 
     <button menuClose ion-item (click)="openProfilePage()"> 
     Profile 
     </button> 

第3步:按新的页面在你的控制器功能

openProfilePage() { 

     this.nav.push(ProfilePage); 
    } 

    openPostPage() { 

      this.nav.push(PostPage); 
    }