Javascript 可单击的分区，带有使用角度的动态模型名称

我需要创建可点击的动态div。目前我正在使用下面的代码来做这件事。 我的服务

export class ReserveService {

  constructor(private http: HttpClient) { }

  getLockers(): Observable<Lockers[]> {
    return this.http.get<Lockers[]>('https://jsonplaceholder.typicode.com/albums');

  }

}

}

请检查以上代码。我使用下面的html来循环它

      <a *ngFor="let locker of availableLockers | async" class="col-md-3 p-3 m-3 success"
                            contenteditable="true" style="border: 1px solid #ccc; background-color: brown;">
                            <label>
                                <input id="lk{{locker.id}}" [value]='locker.id' type="radio" name="locker"
                                    checked="false" [(ngModel)]="locker.id">
                                {{locker.title}}
                            </label>
                        </a>

---

您可以使用div标记并执行以下操作，而不是使用标记-

<div *ngFor="let locker of availableLockers | async; let index = index" class="col-md-3 p-3 m-3 success"
                            contenteditable="true" style="border: 1px solid #ccc; background-color: brown;" (click)="currentSelection = index">
                            <label>
                                <input [value]='locker.id' type="radio" name="locker"
                                    [checked]="getCurrentSelection(index)">
                                {{locker.title}}
                            </label>
                        </div>

我的其他表单模型使用“reserve”，例如：reserve.address，reserve.city。。因此，我需要将[（ngModel）]=“reserve.locker”。我检查了您的代码并将模型更改为reserve.locker。但模型值未通过。请删除locker id和ngmodel，然后重试[（ngmodel）]是否需要发送数据…..该数据基本上用于当前选择数据，对吗….？是的，我需要使用[（ngmodel）]=“reserve.locker”传递所选单选按钮值
<div *ngFor="let locker of availableLockers | async; let index = index" class="col-md-3 p-3 m-3 success"
                            contenteditable="true" style="border: 1px solid #ccc; background-color: brown;" (click)="currentSelection = index">
                            <label>
                                <input [value]='locker.id' type="radio" name="locker"
                                    [checked]="getCurrentSelection(index)">
                                {{locker.title}}
                            </label>
                        </div>

currentSelection :number

getCurrentSelection=(indexSelected)=>{
return currentSelection == indexSelected
}