I have created two components in the same ts file as below. Was referring the example code from https://material.angular.io/components/dialog/examples and it uses the same approach.
import { Component, OnInit, Inject } from '@angular/core';
import { MatDialogModule, MatDialog, MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
@Component({
selector: 'app-srapi',
templateUrl: './srapi.component.html',
styleUrls: ['./srapi.component.scss']
})
export class SrapiComponent {
constructor(private dialog: MatDialog) { }
onCreate(): void {
const dialogRef = this.dialog.open(SrapiTFLFormComponent);
}
}
@Component({
selector: 'app-srapi-tfl-form',
templateUrl: './srapi-tfl-form.html'
})
export class SrapiTFLFormComponent{
constructor(public dialogRef: MatDialogRef<SrapiTFLFormComponent>) {}
}
Also declared and imported both of these in app.module.ts
import { SrapiComponent, SrapiTFLFormComponent } from './srapi/srapi.component';
@NgModule({
declarations: [
AppComponent,
LoginComponent,
HeaderComponent,
FooterComponent,
RegisterComponent,
EdcUserFormComponent,
SidebarComponent,
EdcMasterDataComponent,
SrapiComponent,
SrapiTFLFormComponent
],
imports: [
BrowserModule,
.
.
but it gives an error when it opens the dialog.
ERROR Error: No component factory found for SrapiTFLFormComponent. Did you add it to @NgModule.entryComponents? at noComponentFactoryError (core.js:15705)