侧边菜单没有加载页面

我有一个Ionic2应用程序，它有一个基本的侧面菜单布局，有几页需要加载才能查看。侧边菜单没有加载页面

我app.html看起来像这样

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

    <ion-content> 
     <ion-list> 
      <button menuClose ion-item *ngFor="let p of pages" (click)="openPage(p.component)"> 
       {{ p.title }} 
      </button> 
     </ion-list> 
    </ion-content> 

</ion-menu> 


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

和我app.component.ts看起来是这样的。

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

import {IonicApp, Platform, NavController} from 'ionic-angular'; 
import {LoginPage} from '../pages/login/login'; 

import {MessagesPage} from '../pages/messages/messages'; 
import {ProfilePage} from '../pages/profile/profile'; 
import {TripsPage} from '../pages/trips/trips'; 


@Component({ 
    templateUrl: 'app.html' 
}) 

export class PitchHikeApp { 

    rootPage = LoginPage; 

    static get parameters() { 
     return [[IonicApp], [Platform]]; 
    } 

    constructor(public navCtrl: NavController) {} 

    pages = [ 
     {title: 'My Trips', component: 'TripsPage'}, 
     {title: 'Messages', component: 'MessagesPage'}, 
     {title: 'Profile', component: 'ProfilePage'} 
    ] 

    openPage(page) { 
     console.log(page); 
     this.navCtrl.push(page); 
    } 

}

现在的问题是，一切工作正常。页面加载后，菜单将从我的页面数组中填充页面。

我几乎遵循了Ionic2站点的代码，但是当我单击菜单项时，它会触发一系列控制台错误。主要的错误是“无法读取属性”未定义的“推”'

页面参数正在输出组件的页面，我们正在寻找火，所以我不太确定为什么这会回来为未定义。

来源

2016-12-14 Shane Jones

检查URL http://ionicframework.com/docs/v2/api/navigation/NavController/#你需要定义'@ ViewChild'并在'pages'数组项中看起来像'{title：'My Trips'，组件：TripsPage}' – ranakrunal9

完美的工作方式我需要它我将它从push改为setRoot，但是完全更改了页面，因为它显示了我的菜单图标旁边的Back按钮，导致菜单项无效。 –

你想添加你的评论作为答案，我会标记它吗？谢谢 –

检查NavControllerAPI documentation您需要定义@ViewChild和页面阵列必须定义如下：

pages = [ 
    {title: 'My Trips', component: TripsPage}, 
    {title: 'Messages', component: MessagesPage}, 
    {title: 'Profile', component: ProfilePage} 
];

来源

2016-12-14 10:30:11 ranakrunal9

侧边菜单没有加载页面

回答

相关问题