gpt4 book ai didi

Angular 2复选框选中所有

转载 作者:太空狗 更新时间:2023-10-29 17:27:16 32 4
gpt4 key购买 nike

我有一个列表来检查项目名称。在底部,我想放置一个复选框来选中或取消选中它们。我想我需要一个 *ngIf(如果选中)和一个 *ngFor 循环(选中所有),但这是一个很大的挑战......我不知道我应该如何处理这个。我是否使用 (checked) 或其他东西或 *ngIf="(checked)"然后使用 *ngFor 循环来设置 project.isChecked。我无法理解其中的逻辑。

<div id="drp-project-select">
<div class="scroller" [hidden]="!showMenu">
<div id="search-wrapper">
<i class="fa fa-search fa-xs"></i>
<input [(ngModel)]="searchTerm" type="text" placeholder="Zoek op naam..." #search>
</div>
<ul>
<li *ngFor="#project of projectdata.LoginResponse?.ProjectVM | searchpipe:'Project':search.value">
<label class="checkbox-label" >
<input type="checkbox" class="dropdown-checkbox" [(ngModel)]="project.isChecked" (change)="addProject(project)" >
<span>{{project.Project}}</span>
</label>
</li>
</ul>
</div>
<div class="bottom-data" [hidden]="!showMenu">
<label><input type="checkbox" id="bottom-checkbox"></label>
</div>
</div>

最佳答案

我会在“选中/取消选中所有”复选框上使用控件,以便在用户选中或取消选中时收到通知:

<input type="checkbox" [ngFormControl]="allCtrl"/>

allCtrl 在组件的构造函数中初始化。然后,您可以针对此控件的 valueChanges 属性进行注册,以便收到更新通知并相应地更新 isChecked 字段:

constructor() {
this.allCtrl = new Control();
this.allCtrl.valueChanges.subscribe(
(val) => {
this.projectdata.LoginResponse.ProjectVM.forEach((project) => {
project.isChecked = val;
});
});
}

关于Angular 2复选框选中所有,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35628778/

32 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com