I have a simple list of files with a "Delete" button. I have added a modal window for confirmation, but I am unsure how to connect the Delete function from the main component to the modal window. The modal window is implemented using the @angular/material library. My objective is to delete a file by clicking the button with the class `accept()` in the modal window.
export class FileService {
constructor(private http: HttpClient, @Inject('BASE_URL')
baseUrl: string, public dialog: MatDialog ) {}
public openDeleteModal(name: any, id: any) {
this.dialog.open(DeleteDialog, { data: { name , id} });
}
public fileDelete(id) {
return this.http.delete(this.Url + '/delete' + id).subscribe(
data => {
console.log("DELETE Request is successful ", data);
},
error => {
console.log("Error", error);
})
}
}
@Component({
selector: 'list-files-deletedialog',
templateUrl: './list-files-deletedialog.component.html',
})
export class DeleteDialog {
constructor(public dialogRef: MatDialogRef<DeleteDialog>,
@Inject(MAT_DIALOG_DATA) public data: any) { }
public accept(): void {
// Here I need to integrate the fileDelete function
}
close(): void {
this.dialogRef.close();
}
}