Question

我有一个带有按钮（TeacherComponent）的组件，该按钮可打开“材质对话框”。在该对话框中，是一个文本区域和评级星，用户可以从中发送反馈。单击“提交”按钮后，我需要获取所有这些数据（PopUpFeedbackModel）并将其发送到父组件。
我为此创建了一个服务，但是，如果我通过ngOnInit（）方法获取数据，并且创建了一个按钮，并且在关闭反馈窗口之后，按下该按钮，我就可以获取数据。

PopUpFeedbackService：

export class PopUpFeedbackService {
    private _feedbackSource = new Subject<IPopUpFeedback>();

    constructor() {
    }

    sendFeedback(popUpFeedback: IPopUpFeedback) {
        this._feedbackSource.next(popUpFeedback);
        console.log(popUpFeedback);
    }

    getFeedback() {
        return this._feedbackSource.asObservable();
    }
}

PopUpFeedbackContent（对话框的内容）：

export class PopUpFeedbackContentComponent implements OnInit {
    private _feedbackForm: FormGroup;
    private _starRating: number;
    private _feedback: PopUpFeedback;

    constructor(
        private _formBuilder: FormBuilder,
        @Inject(MAT_DIALOG_DATA) private _name: any,
        private _popUpFeedbackService: PopUpFeedbackService) {
    }

    onSubmitFeedback() {
        this._popUpFeedbackService.sendFeedback(new PopUpFeedback(this._name.name, this.getFeedbackMessage(), this._starRating));
    }
}

onSubmitFeedback()方法将反馈发送到TeacherComponent。

TeacherComponent：

export class TeacherComponent implements OnInit {
  private _feedback: IPopUpFeedback = null;
  @Input() private _teacher: ITeacher;

  get teacher(): ITeacher {
    return this._teacher;
  }

  constructor(
    private _feedbackService: PopUpFeedbackService,
    private _teacherService: TeacherService) {
    this._feedbackService.getFeedback().subscribe(feedback => this._feedback = feedback);
  }

  ngOnInit() {
    this._teacherService.sendTeacherFeedback(this._feedback).subscribe();
  }

}

因此，在对话框关闭后，如何使用该PopUpFeedbackService从Dialog获取值。提交按钮包含mat-dialog-close。

将数据从“材质”对话框传递到父组件

0 个答案: