Question

我正在从Ionic 2 beta升级到rc3。我有以下组件正在运行，但我必须做一些事情才能使其适合rc3。

当用户点击图标时，它会调用以下函数以显示弹出窗口。

  presentPopover(event: Event): void {
    this.popover = this.popoverController.create(SearchJobsPopOverPage, {
      ev: event
    });
    this.popover.present();
  }

SearchJobsPopOverPage

import { Component } from '@angular/core';
import { NavController, ViewController, NavParams, Events } from 'ionic-angular';
import { MapPage } from '../map/map';
import { CategoryPage } from '../category/category';
import { JobModel } from '../model/jobModel';
import { ReviewPage } from '../review/review';
import { RatingModel } from '../model/ratingModel';
import { PersonModel } from '../model/personModel';
import { DateTimePage } from '../datetime/datetime';

@Component({
  //selector: 'searchjobspopover',
  template: `
    <ion-content padding id="search-popover">
      <ion-list>
        <ion-row>
          <ion-col>
            <div style="text-align:center">
              <div id="pinButton"><button ion-button class="search-popover-button" (click)="presentFilterMap()" color="danger"><ion-icon class="search-popover-icon" name="pin"></ion-icon></button></div>
              <p>Location</p>
            </div>
          </ion-col>
          <ion-col>
            <div style="text-align:center">
              <div id="pinButton"><button ion-button class="search-popover-button" (click)="presentFilterCategories()" primary><ion-icon class="search-popover-icon" name="happy"></ion-icon></button></div>
              <p>Sectors</p>
            </div>
          </ion-col>
        </ion-row>
        <ion-row>
          <ion-col>
            <div style="text-align:center">
              <div id="pinButton"><button ion-button class="search-popover-button search-button-star" (click)="presentFilterRating()"><ion-icon class="search-popover-icon" name="star"></ion-icon></button></div>
              <p>Rating</p>
            </div>
          </ion-col>
          <ion-col>
            <div style="text-align:center">
              <div id="pinButton"><button ion-button class="search-popover-button" (click)="presentFilterTime()" color="secondary"><ion-icon class="search-popover-icon" name="time"></ion-icon></button></div>
              <p>Last Online</p>
            </div>
          </ion-col>
        </ion-row>
        <ion-row>
          <ion-col>
            <div style="text-align:center">
              <div id="pinButton"><button ion-button class="search-popover-button" (click)="clearFilters()" color="light"><ion-icon class="search-popover-icon" name="trash"></ion-icon></button></div>
              <p>Clear Filters</p>
            </div>
          </ion-col>
        </ion-row>
      </ion-list>
    </ion-content>
  `
})
export class SearchJobsPopOverPage {
  public nav: NavController = null;
  public jobModel: JobModel = null;
  public events: Events = null;
  public ratingModel: RatingModel = null;
  public personModelLoggedIn: PersonModel = null;
  public lastOnline: number = null;

  constructor(public navParams: NavParams, nav: NavController, public viewCtrl: ViewController, events: Events) {
    this.events = events;
    this.nav = nav;
    this.jobModel = navParams.get('jobModel');
    this.lastOnline = navParams.get('lastOnline');
    this.personModelLoggedIn = navParams.get('personModelLoggedIn');
    if (!this.jobModel) {
      this.jobModel = new JobModel();
    }
    this.ratingModel = navParams.get('ratingModel');
  }

  presentFilterMap(event: Event) {
    //this.viewCtrl.dismiss().then(() => {
    this.nav.push(MapPage, {
      jobModel: this.jobModel,
      ratingModel: this.ratingModel,
      fromSearch: true
    });
    //});
  }

  presentFilterCategories(event: Event) {
    this.viewCtrl.dismiss().then(() => {
      this.nav.push(CategoryPage, {
        jobModel: this.jobModel,
        ratingModel: this.ratingModel,
        fromSearch: true
      });
    });
  }

  presentFilterRating(event: Event) {
    //this.viewCtrl.dismiss().then(() => {
      this.nav.push(ReviewPage, {
        jobModel: this.jobModel,
        ratingModel: this.ratingModel,
        personModelLoggedIn: this.personModelLoggedIn,
        fromFilter: true
      });
    //});
  }

  presentFilterTime(event: Event) {
    this.viewCtrl.dismiss().then(() => {
      this.nav.push(DateTimePage, {
        lastOnline: this.lastOnline,
        fromSearch: true
      });
    });
  }

  clearFilters() {
    if (this.jobModel) {
      this.jobModel.locations = [];
      this.jobModel.categories = [];
      this.jobModel.subCategories = [];
      this.lastOnline = null;
    }
    if (this.ratingModel) {
      this.ratingModel.rating = -1;
    }

    let data = {
      jobModel: this.jobModel,
      ratingModel: this.ratingModel,
      fromClearFilters: true
    };
    this.nav.popToRoot().then(() => {
      this.events.publish('popupFilter:update', data);
    });
  }
}

错误

不显示弹出窗口，但浏览器控制台中显示以下错误：

PopoverCmp ionViewPreLoad error: No component factory found for SearchJobsPopOverPage

任何帮助表示感谢。

Answer 1

对我来说，我忘了按照app.module.ts rc0的要求定义页面。

PopoverCmp ionViewPreLoad错误：找不到SearchJobsPopOverPage

1 个答案: