无法解析MatDialogRef angular 4的所有参数

发布时间：2020-12-17 09:04:13 所属栏目：安全来源：网络整理

导读：我正在研究Angular 4,我正在尝试设置材料包,在这里我试图尝试对话,但它不起作用可能是因为材料包我不确定. 这是我的(dialog.components.ts)： import {Component,OnInit} from '@angular/core';import {MatDialogRef} from '@angular/material'@Component({

我正在研究Angular 4,我正在尝试设置材料包,在这里我试图尝试对话,但它不起作用可能是因为材料包我不确定.

这是我的(dialog.components.ts)：

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

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

    public receivedNode: any;

    constructor(public dialogRef: MatDialogRef<DialogComponent>) {
    }

    ngOnInit() {
    }

}

在我的模块中：

import {MatButtonModule,MatMenuModule,MatToolbarModule,MatIconModule,MatCardModule,MatDialogRef} from '@angular/material';


 @NgModule({
        imports: [
            CommonModule,MatButtonModule,RouterModule.forRoot(
                appRoutes,{enableTracing: true}
            ),],declarations: [],exports: [
            MatButtonModule,MatCardModule
        ],entryComponents: [DialogComponent],providers: [MatDialogRef]
    })
    export class DialogModule {
    }

我收到了这个错误：

有任何想法吗？

编辑

我的通话功能：

openPopup(){
        const config = new MatDialogConfig();
        const dialogRef: MatDialogRef<DialogComponent> = this.dialog.open(DialogComponent,config);

        dialogRef.componentInstance.receivedNode = "test";
        console.log("test");
    }

希望这有助于我拥有的东西：

组件：

import { MatDialog } from '@angular/material';
import { DialogComponent } from './dialogs'; // component name of dialog can add multiple in here.

@Component({
    selector: 'yourComponent',templateUrl: './yourComponent.html'
})
export class YourComponent {

  private dialogRef: any;
  constructor(public dialog: MatDialog) {

  openPopup(){
    this.dialogRef = this.dialog.open(DialogComponent,{
                                    width: '250px',height: '25%',data: { errorcode: errorCode,errormessage: errorMessage }
                                });
                                this.dialogRef.updatePosition({ top: '3%',left: '20%' });
  }

在模块中：

import { DialogComponent } from './dialogs'; // component name of dialog
import { NgModule,CUSTOM_ELEMENTS_SCHEMA,NO_ERRORS_SCHEMA } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { MatDialogModule } from '@angular/material';

@NgModule({
    declarations: [
        DialogComponent 
    ],imports: [
        BrowserModule,MatDialogModule
    ],entryComponents: [
        DialogComponent 
    ],schemas: [CUSTOM_ELEMENTS_SCHEMA,NO_ERRORS_SCHEMA]
})

最后一个对话框：

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

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

    constructor(public dialogRef: MatDialogRef<DialogComponent>,@Inject(MAT_DIALOG_DATA) private data: any) { } // this.data.errormessage contain error message. Not sure if need OnInit.

    ngOnInit() {
    } // I not use this I put the data in html and click on buttons there to interact with the component.

}

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!