首页 文章

Angular材料：没有dialogRef的提供者

提问于
浏览 次
0

嘿我正在尝试使用角度材料对话框，我遇到了一个问题：

错误错误：未捕获（承诺）：错误：StaticInjectorError（AppModule）[MatDialogClose - > MatDialogRef]：StaticInjectorError（平台：核心）[MatDialogClose - > MatDialogRef]：NullInjectorError：没有MatDialogRef的提供者！

module.ts：

...
import {
  MatDialogModule,
  MatInputModule,
  MatCardModule,
  MatButtonModule,
  MatToolbarModule,
  MatExpansionModule
} from "@angular/material";

...

@NgModule({
  declarations: [
    AppComponent,
    PostCreateComponent,
    HeaderComponent,
    PostListComponent
  ],
  imports: [
    BrowserModule,
    RouterModule.forRoot(routes),
    BrowserAnimationsModule,
    FormsModule,
    ReactiveFormsModule,
    MatInputModule,
    MatCardModule,
    MatButtonModule,
    MatToolbarModule,
    MatExpansionModule,
    MatDialogModule,
    HttpClientModule
  ],
  entryComponents: [PostCreateComponent],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule {}

COMPONENT1：

import { MatDialog } from "@angular/material";
 constructor(public dataService: DataService, public dialog: MatDialog) {}

    onEdit(postId: string) {
        this.dataService.editMode = true;
        this.dataService.postIdForEdit = postId;
        const dialogRef = this.dialog.open(PostCreateComponent, {
          width: "500px"
        });
      }

COMPONENT2：

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


      constructor(
        private fb: FormBuilder,
        public dataService: DataService,
        public route: ActivatedRoute,
        private dialogRef: MatDialogRef<PostCreateComponent>
      ) {}

      ...


      onAddPost(form, formDirective: FormGroupDirective) {
   ...
           this.close();
        }

       close() {
 this.dialogRef.close();
      }
    }

我导入了所需的一切，为什么我会收到此错误？还有什么我需要添加 MatDialogRef 实例？我在网上搜索过，但没有找到这个问题的答案....感谢内心

angular angular-material

1 回答

  • 1

    您需要导入 MatDialogModule, MatDialog and MatDialogRef from @angular/material/dialog 而不是 @angular/material

    import from '@angular/material/dialog';

    您还需要确保提供程序数组中存在 MatDialogRef

    providers: [{
  provide: MatDialogRef,
  useValue: {
    close: (dialogResult: any) => { }
  }
}]

    Github issue

    回复于

相关问题