CODEWITHSUNDEEP
angularionic-framework
Mdomin45
Mdomin45

Reputation: 470

No component factory found for [object Object]

I'm trying to create a modal for my Ionic project, but when I run it and click on the button that activates presentEventModal(), I get the error in the title.

import { Component } from '@angular/core';
import { ModalController, NavController, NavParams } from 'ionic-angular';
import { AlertController } from 'ionic-angular';
import { EventModalPage } from '../event-modal/event-modal';


@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {
  currentEvent;
  events = [];
  today = new Date();

  constructor (
    public navCtrl: NavController,
    public alertCtrl: AlertController,
    public modalCtrl: ModalController) {
              this.navCtrl = navCtrl;
              this.alertCtrl = alertCtrl;
              this.modalCtrl = modalCtrl;
    }

  onChange($event) {
    console.log($event);
    this.currentEvent = $event;
  }

  async presentEventModal() {
    const eventModal = await this.modalCtrl.create({
      component: EventModalPage
    });
    return await eventModal.present();
  }

  createEvent(date, title, duration) {
    return {
      date: date,
      title: title,
      duration: duration,
    }
  }
}

I've seen similar errors posted, but this one says [object Object], so I don't know what the problem is. Here is my app.module.ts:

import { BrowserModule } from '@angular/platform-browser';
import { ErrorHandler, NgModule } from '@angular/core';
import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';
import { SplashScreen } from '@ionic-native/splash-screen';
import { StatusBar } from '@ionic-native/status-bar';

import { MyApp } from './app.component';
import { HomePage } from '../pages/home/home';

import { CalendarModule } from 'ion2-calendar'
import { EventModalPage } from '../pages/event-modal/event-modal';

@NgModule({
  declarations: [
    MyApp,
    EventModalPage,
    HomePage
  ],
  imports: [
    CalendarModule,
    BrowserModule,
    IonicModule.forRoot(MyApp)
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp,
    HomePage,
    EventModalPage
  ],
  providers: [
    StatusBar,
    SplashScreen,
    {provide: ErrorHandler, useClass: IonicErrorHandler}
  ]
})
export class AppModule {}

I'm running Ionic 3.20.0 if that matters.

Upvotes: 0

Views: 51

Answers (2)

alex87
alex87

Reputation: 472

import EventModalPage in your app.module.ts and add it to entryComponents: []

Upvotes: 1

Natan Farkash
Natan Farkash

Reputation: 274

You need to add EventModalPage component to the entryComponents section in your module

Upvotes: 2

Related Questions