angular material 2のダイアログにデータを渡す方法

開いたコンポーネントにデータを渡したいのですが。これは、ボタンをクリックしたときにダイアログボックスを開く方法です

let dialogRef = this.dialog.open(DialogComponent, {
            disableClose: true,
            data :{'name':'Sunil'}
        });

ドキュメントページにはdataプロパティがありますが、インストールしたパッケージのMdDialogConfigをチェックしました

/**
 * Configuration for opening a modal dialog with the MdDialog service.
 */
export declare class MdDialogConfig {
    viewContainerRef?: ViewContainerRef;
    /** The ARIA role of the dialog element. */
    role?: DialogRole;
    /** Whether the user can use escape or clicking outside to close a modal. */
    disableClose?: boolean;
    /** Width of the dialog. */
    width?: string;
    /** Height of the dialog. */
    height?: string;
    /** Position overrides. */
    position?: DialogPosition;
}

構成クラスにデータプロパティはありません。

次に、渡されたデータにどのようにアクセスできますか？

angularangular-material

2017/03/08Sunil Garg

だから私はメソッドを追加し、それが1つのコンポーネントで機能していますが、ダイアログボックス（別のコンポーネント）を作成したい場合、それは機能しません

テーブルのコンポーネントと削除ボタン

  openDeleteDialog(user) {
    this.dialog.open(DeleteUserDialogComponent, {
      width: '30%', disableClose: true, data: user
    });
  }

コンポーネントダイアログボックス

export class DeleteUserDialogComponent {

  dataSource = new MatTableDataSource();

  constructor(public dialog: MatDialog, public dialogRef: MatDialogRef<DeleteUserDialogComponent>, private userService: UserService, @Inject(MAT_DIALOG_DATA) public data: any) {}


  deleteUser() {
    this.dataSource.data.splice(this.dataSource.data.indexOf(this.data), 1);
    this.dataSource.data = [...this.dataSource.data];
    console.log(this.dataSource.data);
    console.log(this.data)
  }

  click(): void {
    this.dialogRef.close();
  }
}

2019/09/25TheDevGuy

HTTPデータにダイアログを使用している場合は、RxJSとObservablesがこの問題に最適であることを覚えておいてください。

ダイアログサービス：

    private _dialogDataSubj$ = new Subject<DialogData>();
    dialogData$ = this._dialogDataSubj$.asObservable()

    setDialogData(data: DialogData) {
        this._dialogDataSubj$.next(data)
    }

ダイアログHTML：

<ng-container *ngIf="dialogData$ | async as data; else doneTmp">

私だけかどうかはわかりませんが、ダイアログデータ参照（@Inject）だけでは材料ダイアログのデータを更新できませんでした：dialogRef.data = newData。

2019/12/05blixenkrone