2017-09-24 2 views
0

저는 Angular 2의 재질 모듈에서 MdDialog를 사용하려고합니다. 아래에 표시된 대화 상자를 사용하려고하는 구성 요소가 있습니다.MdDialog 오류에 대한 공급자가 없습니다

import { Component, OnInit } from '@angular/core'; 

import { Aircraft } from '../shared/aircraft'; 
import { AircraftService } from '../shared/aircraft.service'; 
import { MdDialog, MdDialogRef } from '@angular/material'; 
import { NewAircraftDialogComponent } from '../new-aircraft-dialog/new-aircraft-dialog.component'; 

@Component({ 
    selector: 'app-statusboard', 
    templateUrl: './statusboard.component.html', 
    styleUrls: ['./statusboard.component.css'] 
}) 
export class StatusboardComponent implements OnInit { 
    aircrafts: Aircraft[] = []; 

    constructor(private aircraftService: AircraftService, 
       public dialog: MdDialog) { } 

    ngOnInit(): void { 
    this.aircraftService.getAircrafts() 
     .then(aircrafts => this.aircrafts = aircrafts); 
    } 

    openNewAircraftDialog(): void { 
    let dialogRef = this.dialog.open(NewAircraftDialogComponent, { 
     width: '300px' 
    }); 

    dialogRef.afterClosed().subscribe(result => { 
     console.log('The dialog was closed'); 
    }); 
    } 
} 

대화 상자 구성 요소는 아래와 같습니다.

import { Component, OnInit } from '@angular/core'; 
import { Aircraft } from '../shared/aircraft'; 
import { AircraftService } from '../shared/aircraft.service'; 
import { MdDialogRef } from '@angular/material'; 

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

    newAircraft: Aircraft; 

    constructor(private aircraftService: AircraftService, 
       public dialogRef: MdDialogRef<NewAircraftDialogComponent>) { } 

    ngOnInit() { 
    } 

    onSubmitClick(): void { 
    this.dialogRef.close(); 
    } 

    onCloseClick(): void { 
    this.dialogRef.close(); 
    } 

} 

그러나 나는 말을하지 콘솔에서 오류를 얻고있다 "(약속을) catch되지 않은 : 오류 : 오류! MdDialog에 대한 바이더를"

온라인으로 살펴보면 NgModule에 "entryComponents : [NewAircraftDialogComponent]"를 추가한다고되어 있습니다. 나는 가지고있다. 그러나 그것은 그 문제를 해결하지 못했다.

답변

3

내 대답을 찾았습니다.

MdDialog 및 MdDialogRef를 내 구성 요소로 가져 왔지만 MdDialogModule을 가져 오지 않았습니다. 내 app.module.ts imports에 MdDialogModule을 추가하면 모든 것이 작동합니다!

관련 질문과 대답 : Angular 2 No provider for Http

0

module.ts이 추가 수입에서 {MdDialogModule} '@ 각도/재료';

@NgModule ({ 선언 : ' ' '] 수입 : ' ' ] 제공자 : MdDialogModule ]}

add this in module.ts 
 
import \t {MdDialogModule} from '@angular/material'; 
 

 
@NgModule({ 
 
declarations: [ 
 
' 
 
' 
 
'], 
 
    imports: [ 
 
' 
 
' 
 
], 
 
providers: [ 
 
     MdDialogModule 
 
    ]}

관련 문제