Как реализовать функцию удаления в Angular - PullRequest
Новая
       33

Как реализовать функцию удаления в Angular

0 голосов
/ 01 апреля 2020

Я нахожусь в Angular групповом проекте и пытаюсь реализовать функции удаления для текущего рабочего пространства, но я не уверен, как это сделать. Любое предложение или помощь о том, как это сделать?

Внутри add-workspace. HTML файл, у меня есть кнопка, которая отображает диалоговое окно (delete-workspace-dialog).

Внутри Файл компонентов delete-workspace-dialog и кнопка удаления. Я пытаюсь использовать эту кнопку для удаления текущего рабочего пространства.

Внутри файла delete-workspace.dialog.ts, также известного как диалоговое окно удаления 

export class DeleteWorkspaceDialogComponent implements OnInit {

  constructor(
    public dialogRef: MatDialogRef<DeleteWorkspaceDialogComponent>,
    @Inject(MAT_DIALOG_DATA) public data: any) { }

  ngOnInit(): void {
  }
  onNoClick(): void {
    this.dialogRef.close();
  }

  onDeleteClick(): void{
    // Delete workspace here

  }


}

Я пытаюсь использовать это "Да, Кнопка «Удалить» для удаления текущего рабочего пространства

1 Ответ

0 голосов
/ 01 апреля 2020

Надеюсь, что приведенный ниже фрагмент кода может помочь:

В всплывающем компоненте Удалить: 

import { WorkspaceService } from 'src/app/core/services/workspace.service';
export class DeleteWorkspaceDialogComponent implements OnInit {
constructor(
 public dialogRef: MatDialogRef<DeleteWorkspaceDialogComponent>,
 @Inject(MAT_DIALOG_DATA) public data: any,
 private workspaceService: WorkspaceService) { }
ngOnInit(): void {
}
onNoClick(): void {
  this.dialogRef.close();
}
onDeleteClick(): void{
  // Delete workspace here
  this.workspaceService.deleteWorkspace(data.workspace).subscribe(response=>{
    // Do some logic and close the popup
    this.dialogRef.close();
  },error=>{
   // Error handling and close the popup
   this.dialogRef.close();
  })
 }
}

Из родительского компонента, чтобы открыть всплывающее окно удаления:

HTML: 

<button (click)="delete()">Delete</button>

TS: 

delete(){
 this.dialog.open(DeleteWorkspaceDialogComponent,{
    data: {
        workspace: this.workspace
    }
 });
}

Здесь вы передаете рабочее пространство, которое нужно удалить, и во всплывающем окне удаления вы вызываете сервис для удаления рабочего пространства.

Надеюсь, это поможет.

...