I am doing an project in which I should send data from the parent component to MatDialog Component,I can do this
data:{ name:this.options[2].name, costs:this.options[2].cost, }
but I am using Ngfor the component so I need to send which one I am selecting and send only that data
First You need to collect selection data in your parent component before opening the dialog, after that you can pass the data like below
this.matDialog.open(YourComponent, {
"width": '6000px',
"maxHeight": '90vh',
data: Your selected data,
"autoFocus": false
});
Reciving data can be like this
constructor(@Inject(MAT_DIALOG_DATA) public data: any)
and you can access that in side constructor or any method like
this.yourvaribale= this.data;
We can use MatDialogConfig at Parent component.ts
import {MatDialog, MatDialogConfig} from '@angular/material/dialog';
export class userComponent implements OnInit {
dialogConfig = new MatDialogConfig()
dialog: MatDialog
// Now at EventHandler Method let say opneDialog()
openDialog()
{
this.dialogConfig.data ={you Json object Data}
this.dialog.opend(<<you Component>>, this.dialogConfig)
}
}
At child component
constructor inject MAT_DIALOG_DATA
constructor(
@Inject(MAT_DIALOG_DATA) public data : any
)
we can collect data at ngOnInit()
ngOnInit()
{
this.dataVariable = this.data
}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.