1. ホーム
  2. angular

[解決済み] 角材のダイアログにデータを渡す方法 2

2023-02-10 22:02:56

質問

私は ダイアログボックス を使用しています。

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

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;
}

コンフィギュレーションクラスにdataプロパティはありません。

では、渡されたデータにアクセスするにはどうすればよいのでしょうか?

どのように解決するのか?

UPDATE 2 (Angular 5+)

この回答はかなり古くなっています。次のページを見てください。 の代わりにepiphanaticの回答を見てください。 .

<ストライク

最新情報

を使用することができます。 dialogRef.componentInstance.myProperty = 'some data' を使用して、コンポーネントにデータを設定します。

このようなものが必要でしょう。

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

次に DialogComponentname property :

...

@Component({
  ...
})
export class DialogComponent {
   public name: string;

   ...

}

以下のテキストは @angular/material の新しいバージョンでは無効です。

のデータの配置に成功しました。 dialogRef._containerInstance.dialogConfig.data ;

ということで、例えば以下のようなことができます。

let name = dialogRef._containerInstance.dialogConfig.data.name;
console.log(name); // Sunil