2017-12-14 6 views
1

저는 Angular 4에서 작업 중이며 재질 패키지를 설정하려고합니다. 여기서는 대화 상자를 사용해 보려고합니다.하지만 재질 때문에 작동하지 않습니다. 패키지 잘 모르겠습니다.MatDialogRef 각도 4에 대한 모든 매개 변수를 확인할 수 없습니다.

이 내 (dialog.components.ts)입니다 : Uncaught Error: Can't resolve all parameters for MatDialogRef: (?, ?, ?).

어떤 아이디어 :

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


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

나는이 오류가 발생했습니다 :

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() { 
    } 

} 

그리고 내 모듈

?

편집

내 통화 기능 :

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

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

Plz은 대화를 만들 때 코드를 공유합니다. 'this.dialogRef = this.dialog.open (DialogComponent, { 너비 :'150px ', 높이 :'100 % ' })과 같은 것;이 plz을 읽지 않은 경우 https://material.angular.io/components/dialog/overview – Swoox

+0

@Swoox 친절하게 내 편집을 확인하십시오 –

+0

당신의 설정이 비어 있다고 생각합니다 :'const dialogRef : MatDialogRef = this.dialog.open (DialogComponent);'또한 ** DialogComponent **는 ** 모듈 **의 선언에 추가됩니다. – Swoox

답변

1

희망이다 (Ref로 끝나는) :

구성 요소 :

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', 
    templateUrl: './dialog.component.html', 
    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. 

} 
2

이 공급자 목록에서 MatDialogRef를 제거합니다.

이 아닙니다 공급자가,이 객체에 대한 참조입니다 내가 가지고있는 문제는이 도움이