Hey, in a nutshell i am trying to run this on click:
public async showModal(paycheck): Promise<void> {
const modal = await this.modalCtrl.create({
component: ModalPaycheckComponent
});
await modal.present();
}
However i get this error:
ERROR Error: "Uncaught (in promise): Error: No component factory found for [object Object]. Did you add it to @NgModule.entryComponents?
noComponentFactoryError@http://localhost:8100/build/vendor.js:4610:39
CodegenComponentFactoryResolver.prototype.resolveComponentFactory@http://localhost:8100/build/vendor.js:4674:19
ModalCmp.prototype.ionViewPreLoad@http://localhost:8100/build/vendor.js:63123:36
ViewController.prototype._lifecycle@http://localhost:8100/build/vendor.js:22622:33
ViewController.prototype._preLoad@http://localhost:8100/build/vendor.js:22484:14
NavControllerBase.prototype._preLoad@http://localhost:8100/build/vendor.js:53888:14
NavControllerBase.prototype._viewInit@http://localhost:8100/build/vendor.js:53578:14
NavControllerBase.prototype._nextTrns/<@http://localhost:8100/build/vendor.js:53389:23
F</l</t.prototype.invoke@http://localhost:8100/build/polyfills.js:3:14976
onInvoke@http://localhost:8100/build/vendor.js:5434:33
F</l</t.prototype.invoke@http://localhost:8100/build/polyfills.js:3:14916
F</c</r.prototype.run@http://localhost:8100/build/polyfills.js:3:10143
f/<@http://localhost:8100/build/polyfills.js:3:20242
F</l</t.prototype.invokeTask@http://localhost:8100/build/polyfills.js:3:15660
onInvokeTask@http://localhost:8100/build/vendor.js:5425:33
F</l</t.prototype.invokeTask@http://localhost:8100/build/polyfills.js:3:15581
F</c</r.prototype.runTask@http://localhost:8100/build/polyfills.js:3:10834
o@http://localhost:8100/build/polyfills.js:3:7894
F</h</e.invokeTask@http://localhost:8100/build/polyfills.js:3:16823
p@http://localhost:8100/build/polyfills.js:2:27648
v@http://localhost:8100/build/polyfills.js:2:27894
So i have read a lot of forum topics regarding this specific error. However none has solved the issue for me and i am way too new to module concept to solve this myself in fairly quick amount of time.
Here is the involved page and component i have defined the entryComponent in both places, not really sure why as i dont think it should be needed. Can anybody spot something wrong with this?
modal-paycheck.ts
import { Component, OnInit, Input } from '@angular/core';
import { ModalController } from 'ionic-angular';
@Component({
selector: "modal-paycheck",
templateUrl: 'modal-paycheck.html'
})
export class ModalPaycheckComponent implements OnInit {
public text;
constructor(public modalCtrl: ModalController) {
console.log('Hello ModalPaycheckComponent Component');
this.text = 'Hello World';
}
ngOnInit() {}
}
modal-paycheck.module.ts
import { ModalPaycheckComponent } from "./modal-paycheck";
import { NgModule } from "@angular/core";
import { IonicModule } from "ionic-angular";
import { CommonModule } from "@angular/common";
@NgModule({
declarations: [ModalPaycheckComponent],
imports: [IonicModule, CommonModule],
entryComponents: [ModalPaycheckComponent]
})
export class ModalPaycheckComponentModule { }
paycheck.ts
import { Component, Injectable } from '@angular/core';
import { IonicPage, NavController, NavParams, ModalController } from 'ionic-angular';
import { FileTransfer, FileTransferObject } from '@ionic-native/file-transfer';
import { File } from '@ionic-native/file';
import { FileOpener } from '@ionic-native/file-opener';
import { Printer } from '@ionic-native/printer';
import { UserProvider } from '../../providers/user/user';
import moment from 'moment';
import { ModalPaycheckComponent } from '../../components/modal-paycheck/modal-paycheck';
@IonicPage()
@Component({
selector: 'page-paycheck',
templateUrl: 'paycheck.html',
})
@Injectable()
export class PaycheckPage {
years: any;
moment: any = moment;
userData: any;
selectedYear: any;
paychecks: any = [];
constructor(public navCtrl: NavController, public modalCtrl: ModalController, public navParams: NavParams, private transfer: FileTransfer, private file: File, private fileOpener: FileOpener, private printer: Printer, public userService: UserProvider) {
}
public async showModal(paycheck): Promise<void> {
const modal = await this.modalCtrl.create({
component: ModalPaycheckComponent
});
await modal.present();
}
}
paycheck.module.ts
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { PaycheckPage } from './paycheck';
import { FileTransfer } from '@ionic-native/file-transfer';
import { File } from '@ionic-native/file';
import { FileOpener } from '@ionic-native/file-opener';
import { Printer } from '@ionic-native/printer';
import { ModalPaycheckComponent } from '../../components/modal-paycheck/modal-paycheck';
import { ModalPaycheckComponentModule } from '../../components/modal-paycheck/modal-paycheck.module';
@NgModule({
declarations: [
PaycheckPage
],
imports: [
ModalPaycheckComponentModule,
IonicPageModule.forChild(PaycheckPage),
],
providers: [
FileTransfer,
File,
FileOpener,
Printer
],
entryComponents: [
ModalPaycheckComponent
]
})
export class PaycheckPageModule { }
ionic info
C:\wamp64\www\timetjek\User_app>ionic info
Ionic:
Ionic CLI : 5.4.14 (C:\Users\agaci\AppData\Roaming\npm\node_modules\ionic)
Ionic Framework : ionic-angular 3.9.2
@ionic/app-scripts : 3.2.4
Cordova:
Cordova CLI : 9.0.0 (cordova-lib@9.0.1)
Cordova Platforms : none
Cordova Plugins : no whitelisted plugins (1 plugins total)
Utility:
cordova-res : 0.8.1
native-run : 0.3.0
System:
Android SDK Tools : 26.1.1 (C:\Users\agaci\AppData\Local\Android\Sdk)
NodeJS : v12.14.0 (C:\Program Files\nodejs\node.exe)
npm : 6.13.4
OS : Windows 10
