【发布时间】:2018-03-05 06:17:42
【问题描述】:
我正在尝试使用 Angular 2 的材料模块中的 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();
}
}
但我在控制台中遇到错误:
错误:未捕获(承诺中):错误:没有 MdDialog 的提供者!
上网查了一下,上面写着把"entryComponents: [NewAircraftDialogComponent]"加到NgModule。我做了,但这并没有解决问题。
【问题讨论】: