Как передать данные в общий угловой компонент (диалог)

Question

Есть ли более интуитивный способ выполнить то, что у меня ниже?

Я пытаюсь создать общий компонент диалога, который вызывающий абонент может настроить, передав класс setupParam.

Я все еще новичок в мире Angular, хотя приведенный ниже код работает так, как я хочу, для другого разработчика не очень интуитивно понятно, что нужен класс setupParam.

Диалог HTML:

<div>
  <h2 mat-dialog-title>{{setupParams.title}}</h2>
  <mat-dialog-content>
    <ng-content></ng-content>
  </mat-dialog-content>
  <mat-dialog-actions>
    <button mat-raised mat-dialog-close [mat-dialog-close]="false">{{setupParams.button1}}</button>
    <button mat-raised [mat-dialog-close]="true">{{setupParams.button2}}</button>
  </mat-dialog-actions>
</div>

Тип диалога:

export class DialogGeneric {

  public setupParams: GenericDialogProperties;

  constructor(@Inject(MAT_DIALOG_DATA) public data: any) {
    this.setupParams = data.dialogParams;
  }
    //public dialogRef: MatDialogRef<DialogGeneric>, @Inject(MAT_DIALOG_DATA) public data: any) {}

}

Вызов программы Typescript:

  myMethod(id) {
    let myDialog = this.dialog.open(MyDialog, {
      height: "400px", width: "400px",
      data: { someData: "some data", dialogParams: this.modalSetup },
  });

Answer 1

Почему бы не использовать @Input Decorators в вашем диалоговом окне? Пример:

В диалоговом окне:

 import { Component, Input } from '@angular/core';
    @Component({
    .....
    })
    export class DialogComponent{
       @Input() data: any;
    }

В родительском компоненте:

<dialog [data]='dataObject'> 

dataObject - это объект, который вы будете заполнять в родительском классе текстом, заголовком, изображениями, которые вы хотите показать в диалоге

dataObject = {
    title: 'Title',
    text: 'Some question or any text' 
}

Документация и полный пример