Question

我有一个从ngFor创建的列表，在这个列表中我有一个带输入复选框的子项，我需要在特定事件完成后将所有checked == true设置为false。

我无法在角度2/4，无Jquery上找到有关此实现的任何信息。

代码示例遵循

<div *ngFor="let x of all">
   <input type="checkbox" #userId (click)="selectedX($event, userId.checked, x)">
</div>

基本上，您可以从模式中选择多个用户并选择激活或停用它们。我希望在模态关闭后将复选框设置为false ...

无法找到办法。

Answer 1

维护一个数组字段来存储复选框状态。为模态关闭事件注册事件。然后，您可以循环并将所有复选框状态设置为false。在这里使用双向绑定。

page.component.ts

export class Page {
    chkBoxStates: [{state: true, data:{}}, {state: false, data:{}}, {state: true, data:{}}];

    onModalClose(): void {
        _.each(this.chkBoxStates, (item) => {
            item.state = false;
        })
    }
}

page.component.html

<div *ngFor="let item of chkBoxStates">
    <input type="checkbox" [(ngModel)]="item.state">
</div>

Answer 2

所以我按照Dulaj所说的并创建了一个新的数组，在这个新的数组中，我推送了我的旧数据和一个新的状态信息。

for (let user of users) {
    this.newArray.push({user: user, state: false});
}

通过这种方式，我可以迭代这个新数组，并且仍然可以使用我的旧列表，并且可以使用新的状态信息来设置我的复选框，就像Dulaj所示。

如何在ngFor

2 个答案: