Angular 2 and Material Designs - Example Dialog is empty Angular 2 and Material Designs - Example Dialog is empty angular angular

Angular 2 and Material Designs - Example Dialog is empty


It looks like you may be missing a few things in your attempt.

First in your code, be sure to include the MdDialogRef in your DialogOverviewExampleDialog class constructor, like so, per the documentation:

import {Component} from '@angular/core';import {MdDialog, MdDialogRef} from '@angular/material'; // Added "MdDialogRef"@Component({  selector: 'app-home',  templateUrl: './home.component.html',  styleUrls: ['./home.component.css']})export class HomeComponent {  constructor(public dialog: MdDialog) {}  openDialog() {    let dialogRef = this.dialog.open(DialogOverviewExampleDialog);    // If you need a result from your dialog    dialogRef.afterClosed().subscribe(result => {      // Do something with result, if needed.    });  }}@Component({  selector: 'dialog-overview-example-dialog',  templateUrl: './dialog-overview-example-dialog.html',})export class DialogOverviewExampleDialog {  // Added Constructor  constructor(public dialogRef: MdDialogRef<DialogOverviewExampleDialog>) {}}

Secondly, for the error:

No component factory found for DialogOverviewExampleDialog. Did you add it to @NgModule.entryComponents?

Your app.module.ts must define your dialog component (DialogOverviewExampleDialog) in two places: declarations and entryComponents.

For example:

@NgModule({  declarations: [    HomeComponent,    DialogOverviewExampleDialog // HERE  ],  entryComponents: [     DialogOverviewExampleDialog // AND HERE  ],  ...