我有一个下拉元素列表，它由 *ngFor 循环索引。
<div class="item-wrapper" *ngIf="showItems">
<div class="wrap-collapsible" *ngFor="let item of items; let i = index">
<input id="{{i}}" class="toggle" type="checkbox">
<label for="{{i}}" class="dropdown-toggle" tabindex="0" (click)="selectItem(item)">
Threat {{item.id}}: {{item.category}}
</label>
<div class="collapsible-content">
<div class="content-wrapper">
<p class="title">{{item.title}}</p>
</div>
</div>
</div>
</div>
默认情况下，复选框输入在单击时被选中，并在选择其他元素时保持选中状态。
我将如何取消选中除最后一个点击之外的所有元素？
我试过做...
<input id="{{i}}" type="checkbox" [checked]="i == selectedElement">
...在 selectItem() 方法中传递索引时，selectedElement 设置为 i。这不起作用，因为这样就没有项目可以选择了。
谁能给我一个正确的方向推动？
绑定到您输入的更改功能：
<input id="{{i}}" class="toggle" type="checkbox" (change)="setLastClicked(item)">
在您的 TS 中：
setLastClicked(item) {
this.lastSelected = item;
}
您现在可以使用该内存引用与 [un] 全部选中的项目进行比较：
toggleCheck() {
this.items.forEach(item => item.checked = {
if(item === this.lastSelected) return;
item.checked = !item.checked;
});
}
有了内存引用，您就不再需要 ID。
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句