Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Passing input values to Dialog Component [duplicate]

Tags:

I am implementing the dialog component of material2 and faced this issue:

I want to make a generic dialog for all the confirmation type of messages, where developer can input the text to the dialog as per the business requirement. But as per the docs there are no such provisions. Do we have a work around for the same, or I should post it as a feature request on github?

export class ConfirmationDialogComponent implements OnInit {   @Input() confirmationText: string;   @Input() confirmationTitle: string;   @Input() confirmationActions: [string, string][] = [];    constructor(public dialogRef: MdDialogRef<ConfirmationDialogComponent>) {}    ngOnInit() {} } 

Calling like this:

let dialogRef = this.dialog.open(ConfirmationDialogComponent); 
like image 502
Sumit Agarwal Avatar asked Dec 28 '16 07:12

Sumit Agarwal


1 Answers

open will give you the component instance , means you can inject what ever you want to it like this :

openDialog() {     let dialogRef = this.dialog.open(DialogOverviewExampleDialog);     let instance = dialogRef.componentInstance;     instance.text = "This text can be used inside DialogOverviewExampleDialog template ";     console.log('dialogRef',dialogRef);   } 

Then obviously inside the DialogOverviewExampleDialog template you can do :

   this is the text {{text }} 

Plunker

What I would normally do, I'd create a configuration object which my Component understands and then I'll pass this when opening the modal :

 private config = {     title :"Hello there ",     text :"What else ? "  };   openDialog() {     let dialogRef = this.dialog.open(DialogOverviewExampleDialog);     let instance = dialogRef.componentInstance;     instance.config = this.config;     console.log('dialogRef',dialogRef);   } 

And then inside the modal component :

<div class="my-modal">    <h1>{{config.title}}</h1>    <p>{{config.text}}</p> </div> 
like image 154
Milad Avatar answered Oct 08 '22 15:10

Milad