2017-05-05 36 views
2

我有模态对话框一些问题:模式对话框,当应用程序负载

1.我如何将数据传递到模态和模态返回的数据?

2.我想显示模式对话框,当应用程序加载后,他按下按钮,它会进入第二页。

我们假设这是我的对话框。

@Component({ 
    selector: 'pizza-component', 
    template: ` 
    <button type="button" (click)="openDialog()">Open dialog</button> 
    ` 
}) 
export class PizzaComponent { 

    constructor(public dialog: MdDialog) { } 

    openDialog() { 
    let config = new MdDialogConfig(); 
    let dialogRef:MdDialogRef<PizzaDialog> = this.dialog.open(PizzaDialog, config); 

    } 
} 

@Component({ 
    selector: 'pizza-dialog', 
    template: ` 
    <h2>{{name}}</h2> 
    <p>Size: {{size}}</p> 
    <button type="button" (click)="dialogRef.close('yes')">Yes</button> 
    <button type="button" (click)="dialogRef.close('no')">No</button> 
    ` 
}) 
export class PizzaDialog { 
    name:string; 
    size:string; 
    constructor(public dialogRef: MdDialogRef<PizzaDialog>) { } 
} 

回答

0

如何将数据传递到模态并从模态中返回数据? - 关于此,有很棒的文档(https://material.angular.io/components/component/dialog)。
基本上,您可以通过设置组件实例将数据从父组件设置为对话框组件。您可以从对话框可以通过对话框引用后关闭方法将数据返回到父组件是这样的:

dialogRef.afterClosed().subscribe(result => { 
    this.selectedOption = result; 
}); 

我想显示模式对话框,当应用程序加载后,他按下了按钮,它去了第二页。 - 您可以在ngOnInit生命周期钩子的对话框中调用打开方法。

相关问题