Question

我有一个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网站上的代码，但是当我点击菜单项时，它会触发一大堆控制台错误。主要错误是＆＃34;无法读取属性＆＃39;推送＆＃39;未定义＆＃34;

页面参数正在输出我们要查找的页面的组件，因此我不太清楚为什么这会以未定义的形式返回。

Answer 1

检查您需要定义NavController的{{1}} API documentation，并且需要定义网页数组，如下所示：

@ViewChild

侧边菜单没有加载页面

1 个答案: