如何将数据传递给角材料 2 的对话框 [英] How to pass data to dialog of angular material 2

问题描述

我正在使用 angular material2 的对话框.

I am using dialog box of angular material2.

我想将数据传递给打开的组件.这是我单击按钮打开对话框的方式

I want to pass data to the opened component. Here is how I am opening dialog box on click of a button

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

在文档页面上有数据属性，但我在安装的包中检查了 MdDialogConfig

On the documentation page there is data property, But I checked MdDialogConfig in my installed packages

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

配置类中没有数据属性.

there is no data property in configuration class.

现在我如何访问传递的数据?

Now How can I access that passed data?

推荐答案

UPDATE 2 (Angular 5+)

这个答案已经过时了.看看顿悟的答案.

<打击>

您可以使用 dialogRef.componentInstance.myProperty = 'some data' 来设置组件上的数据.

You can use dialogRef.componentInstance.myProperty = 'some data' to set the data on your component.

你需要这样的东西:

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

然后在您的 DialogComponent 中，您需要添加您的 name 属性:

Then in your DialogComponent you need to add your name property:

...

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

   ...

}

<打击>我没有找到任何关于此的文档，所以我也开始查看源代码.因此，这可能不是官方的做法.

I didn't find any documentation on this, so i started looking into the source code too. Because of that, this might not be the official way of to do.

我成功定位到dialogRef._containerInstance.dialogConfig.data中的数据；

I successfully located the data in dialogRef._containerInstance.dialogConfig.data;

所以你可以做的就是例如

So what you can do is for example

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

这篇关于如何将数据传递给角材料 2 的对话框的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！