简体   繁体   English

角垫对话框未定义值 afterClosed()

[英]Angular mat-dialog undefined value afterClosed()

i have been working in a project with angular 5 and angular material, i´m tryng to pass value to dialog and get the value back when the dialog is closed, but for some reason i´m getting undefined when the dialog is closed.我一直在使用 angular 5 和 angular material 的项目中工作,我试图将值传递给对话框并在对话框关闭时取回值,但由于某种原因,当对话框关闭时我变得不确定。

Dialog对话

import { Component, OnInit, Inject } from '@angular/core';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { ReaderService } from '../../../../../services/reader/reader.service';
import { MatDialog, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material';
@Component({
  selector: 'fuse-comment-dialog',
  templateUrl: './comment-dialog.component.html',
  styleUrls: ['./comment-dialog.component.scss']
})
export class CommentDialogComponent implements OnInit {

  public commentsForm: FormGroup;
  constructor(
    private fb: FormBuilder,
    private readerService: ReaderService,
    public dialogRef: MatDialogRef<CommentDialogComponent>,
    @Inject(MAT_DIALOG_DATA) public data: any
  ) { }

  ngOnInit() {
    this.commentsForm = this.fb.group({
      commentText: ['', [
        Validators.required
      ]],
      commentType: 'PrivateComment',
      commentGroup: 'Therabytes'
    });
  }

  public sendComent(): void {
    this.data['text'] = this.commentsForm.value.commentText;
    this.data['commentVisibility'] = this.commentsForm.value.commentType;
    this.readerService.newComment(this.data)
      .then((commentId) => {
        this.data['id'] = commentId;
        this.dialogRef.close();
      });
  }

  public closeDialog(): void {
    this.commentsForm.value.commentText = '';
    this.dialogRef.close();
  }

}

Comment Component评论组件

public commentDialog(): void {
    let newComment = {
      documentId: this.document.id
    };
    let commentDialogRef = this.dialog.open(CommentDialogComponent, {
      width: '300px',
      data: newComment
    });
    commentDialogRef.afterClosed().subscribe(comment => {
      console.log(comment);
      this.comments.push(comment);
    });
  }

为了从您的模态获取数据到您的afterClosed() Observable,您需要将一个参数传递给您的dialogRef.close()方法,如下所示:

this.dialogRef.close(this.data);

This issue had me stumped for a while.这个问题让我难过了一阵子。

Assuming that you've already tried the accepted answer and still have issues, please ensure that you inject MatDialogRef , instead of DialogRef .假设您已经尝试了接受的答案并且仍然有问题,请确保您注入MatDialogRef ,而不是DialogRef

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM