應用程序組件的對話框輸入會導致錯誤

Question

我在角度材質對話框中收到錯誤。

我想從對話框中輸入一些內容並將其發送到應用程序的組件以作進一步處理。我查了角的材料文件的網站，嘗試這樣做，但得到了在控制檯的一些錯誤如下圖所示：

ERROR: Error: No provider for MdDialog!

app.module.ts：

import { BrowserModule } from '@angular/platform-browser'; 
import { NgModule } from '@angular/core'; 
import 'hammerjs'; 
import { AppComponent } from './app.component'; 
import { DialogComponent } from './dialog/dialog.component'; 

@NgModule({ 
    declarations: [ 
    AppComponent, 
    DialogComponent 
    ], 
    imports: [ 
    BrowserModule 
    ], 
    entryComponents:[DialogComponent], 
    providers: [], 
    bootstrap: [AppComponent] 
}) 
export class AppModule { } 

dialog.component.ts：

import { Component, OnInit, Inject } from '@angular/core'; 
import { MdDialogRef, MD_DIALOG_DATA } from '@angular/material'; 

@Component({ 
    selector: 'app-dialog', 
    templateUrl: './dialog.component.html', 
    styleUrls: ['./dialog.component.css'] 
}) 
export class DialogComponent implements OnInit { 

    constructor(private dialog:MdDialogRef<DialogComponent>, @Inject(MD_DIALOG_DATA) public data:any) { } 

    ngOnInit() { 
    } 

    close(){ 
    this.dialog.close('close'); 
    } 

} 

app.component.ts：

import { Component } from '@angular/core'; 
import { MdDialog } from '@angular/material'; 
import { DialogComponent } from './dialog/dialog.component'; 

@Component({ 
    selector: 'app-root', 
    templateUrl: './app.component.html', 
    styleUrls: ['./app.component.css'] 
}) 
export class AppComponent { 
    title = 'app'; 

    constructor(private dialog: MdDialog){} 

opendialog() : void{ 
    let dialog = this.dialog.open(DialogComponent,{ 
    width: '500px', 
    data: 'Hi How are you' 
    }); 

    dialog.afterClosed().subscribe((result)=> console.log(result)); 
} 

} 

app.component.html：

<button (click)="opendialog()">Popup</button> 

dialog.component.html：

<p> 
    dialog works! 
</p> 

<button (click)="close()" md-button>Close</button> 

Answer 1

你必須把你的DialogModule NgModule