PopoverCmp ionViewPreLoad error: No component factory found for SearchJobsPopOverPage - ionic2

Question

I am in the process of upgrading from Ionic 2 beta to rc3. I have the following components that were working, but there must be something I need to do to make it fit with rc3.
When the user clicks an icon, it invokes the following function inorder to show a popover.
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);
});
}
}
Error
The popover is not displayed, but the following error is displayed in the browser console:
PopoverCmp ionViewPreLoad error: No component factory found for SearchJobsPopOverPage
Any help appreciated.

Answer 1

Sill me, I forgot to define the page in app.module.ts as is required post rc0.