2

我重新提出了这个问题，因为它没有在类似的讨论中解决我的问题。

即使在我一步一步地遵循官方教程之后，我仍然有错误'No provider for MdDialogRef '。

我有两个组件。第一个组件：

import { MdDialog} from "@angular/material";

import { DocumentDialogComponent } from './document-dialog.component';    

@Component({
  selector: 'documents-list',
  template
})
export class DocumentsListComponent {

  constructor(
     public dialog: MdDialog) {
  }

  openFormDialog() {

   let dialogRef  = this.dialog.open(DocumentDialogComponent,
   {
   }
   );
   dialogRef.afterClosed().subscribe(result => {
      this.selectedOption = result;
   });
  }

我的第二个组件（对话框）：

import { MdDialogRef} from "@angular/material";

@Component({
 selector: 'document-dialog',
 template
 })

export class DocumentDialogComponent {
    constructor(
        public dialogRef: MdDialogRef<DocumentDialogComponent>
    ) {}
}

我的模块配置：

  import { MaterialModule } from "@angular/material";
  import { DocumentsListComponent } from './documents-list.component';
  import { DocumentDialogComponent } from './document-dialog.component';

  imports : [
    MaterialModule.forRoot() 
   ],

  declarations: [
      AppComponent,
      DocumentListComponent,
      DocumentDialogComponent
    ],
    entryComponents: [
      AppComponent,
      DocumentListComponent,
      DocumentDialogComponent
    ],
    providers: [
    ],
    bootstrap: [
      AppComponent
    ]

为什么我仍然有错误： 

Error in ./DocumentsListComponent class DocumentsListComponent - inline template:0:167 caused by: No provider for MdDialogRef!
4

2 回答 2

4

我删除了<DocumentsListComponent></DocumentsListComponent>模板中的标签，现在它可以工作了。

于 2017-02-28T13:41:08.760 回答
2

我们可以通过使用 componentInstance属性在DocumentDialogComponent中设置引用来消除此错误。

我们可以通过 open 方法返回的引用的 componentInstance 设置其属性，而不是将 MdDialogRef 注入到组件中。

这是修改后的工作代码：

import { MdDialog} from "@angular/material";

import { DocumentDialogComponent } from './document-dialog.component';    

@Component({
  selector: 'documents-list',
  template
})
export class DocumentsListComponent {

  constructor(
     public dialog: MdDialog) {
  }

  openFormDialog() {

   let dialogRef  = this.dialog.open(DocumentDialogComponent);

    //set the reference here
    dialogRef.componentInstance.dRef = dialogRef;

   dialogRef.afterClosed().subscribe(result => {
      this.selectedOption = result;
   });
  }

对话框组件在这里：

import { MdDialogRef} from "@angular/material";

@Component({
 selector: 'document-dialog',
 template
 })

export class DocumentDialogComponent {
    public dRef:MdDialogRef<DocumentDialogComponent>
    constructor() {}
}
于 2017-08-18T02:52:11.570 回答