Css 扩展面板内部的垫选择列表

我需要在扩展中创建一个带有复选框的选择列表 扩展面板

<mat-expansion-panel *ngFor="let item of Dataseource">
  <mat-expansion-panel-header style="display:flex" class="mat-row">
    {{datasource.showheader}}
  </mat-expansion-panel-header>
  <div *ngFor="let match of Datasource; let i= index">

                      <mat-selection-list  [(ngModel)]="selectedOptions" (ngModelChange)="onNgModelChange($event)">
                            <mat-list-option [value]="match">
                              <div class="container-name">
                                <div class="col-6">{{match.Name }}  vs {{ match.Address }}</div>
                              </div>
                              <mat-divider [inset]="true" *ngIf="!last"></mat-divider>
                            </mat-list-option>
                          </mat-selection-list>
    </div>
  </div>
</mat-expansion-panel>

{{datasource.showheader}
{{match.Name}vs{{match.Address}

我应该能够选择单个项目并将其添加到具有标题和选定项目的列表对象中

<mat-expansion-panel *ngFor="let item of Datasource">
  <mat-expansion-panel-header style="display:flex" class="mat-row">
    {{item.Name}}
  </mat-expansion-panel-header>

                      <mat-selection-list ngFor="let match of item.match; let i= index;" [(ngModel)]="selectedOptions" (ngModelChange)="onNgModelChange($event)">
                            <mat-list-option *ngFor="let match of item.match" [value]="match">
                              <div class="container-name">
                                <div class="col-6">{{match.Name }}  vs {{ match.Address }}</div>

                              </div>

                            </mat-list-option>
                          </mat-selection-list>

      </div>

      <hr>
</mat-expansion-panel>

{{item.Name}
{{match.Name}vs{{match.Address}

{{item.Name}
{{match.Name}vs{{match.Address}

不知道为什么我在这个问题上被否决了

---

当然，我找到了解决问题的办法，希望能帮助别人。

不知道为什么我在这个问题上被否决了

---

当然，我找到了解决问题的方法，希望能帮助别人。

这就是我解决问题的方法。我需要3个级别的NGO来指导这就是我解决问题的方法。我需要3个级别的指令