Html 如何删除包含子节的节

在“我的帮助”对话框中，用户可以创建节和子节。我试图实现一个功能，用户可以删除一个节，即使该节包含一个或多个小节

我可以删除一节，如果该节没有任何小节，我也可以删除任何小节

问题是，如果某节有一小节，我就不能删除该节

这就是我的数据库的样子。（一对多关系）

Id |名称|父Id（对Id的引用）|文本

宝马（部分）|零|零

如何修理宝马| 1 |这就是如何修理宝马

修复宝马第2部分| 1 |这是如何修复宝马第2部分

TS

HTML

部分

---

显示您的html。那么重构你的函数就容易多了Hi@robert我已经上传了我的html，你能帮我再检查一下吗。非常感谢。

mappedSections = [];


  openConfirmDialog(section, isSection: boolean) {
    let dialogRef = this.dialog.open(ConfirmDialogComponent, {
      data: {
        isSection
      },
    }
    );
    dialogRef.afterClosed().subscribe((value) => {
      if (!!value) {
        this.delete(section, isSection)
        this.fetchData();
      }
    })
  }


  delete(sec, isSection) {
    if (isSection) {
      this.HelpService.deleteHelp(sec.id).subscribe(() => {
        const index = this.mappedSections.findIndex((value) => value.id == sec.id);
        this.mappedSections = this.mappedSections.filter(section => section.id != sec.id)
        if (~index) {
          this.HelpService.deleteHelp(sec.id).subscribe(() => {
            this.mappedSections = this.mappedSections.filter(subsection => subsection.id != sec.id);
            this.cdRefs.detectChanges()
          })
        }
      })
    } else {
      this.HelpService.deleteHelp(sec.id).subscribe(() => {
        const index = this.mappedSections.findIndex((value) => value.id == sec.parentId);
        if (~index) {
          this.mappedSections[index].subSections = this.mappedSections[index].subSections.filter((subsection) => subsection.id != sec.id)
        }
      })
    }
  }

                    <div *ngFor="let section of mappedSections">
                        <div style="margin-top: 20px;" *ngIf="section.parentId == null">
                            <p>Section</p>
                            <div>
                                <mat-form-field appearance="fill">
                                    <input matInput type="text" style="width: 200px; height: 15px;"
                                        (ngModelChange)="nameChanged({newValue: $event, isSection: true, id: section.id})"
                                        [(ngModel)]="section.name">
                                </mat-form-field>
                                <button mat-icon-button color="warn" matTooltip="Delete this Section"
                                    style="bottom: 10px;" (click)="openConfirmDialog(section, true)">
                                    <img class="button-icons" src="/assets/images/icons/delete-icon-warn.svg">
                                </button>
                            </div>
                        </div>
                        <div>
                            <div class="substyle" *ngFor="let subSection of mappedSections">
                                <div *ngIf="subSection.parentId == section.id">
                                    <mat-form-field appearance="fill">
                                        <input [disabled] = "subSection.id !== selectedId" matInput style="width: 200px; height: 15px;" type="text"
                                            (ngModelChange)="nameChanged({newValue: $event, isSection: true, id: subSection.id})"
                                            [(ngModel)]="subSection.name">
                                    </mat-form-field>
     
    
                                    <button mat-icon-button color="warn" matTooltip="Delete this Subsection"
                                        style="bottom: 10px;" *ngIf="isSubsection"
                                        (click)="openConfirmDialog(subSection, false)">
                                        <img class="button-icons" src="/assets/images/icons/delete-icon-warn.svg">
                                    </button>
                                </div>
                            </div>