如何在Angular中接受多个选中的复选框？
在Angular中，可以通过使用ngModel指令和ngModelGroup指令来接受多个选中的复选框。
首先，在HTML模板中，使用ngModel指令将复选框绑定到一个变量上，例如：
<input type="checkbox" [(ngModel)]="checkboxValues.option1"> Option 1
<input type="checkbox" [(ngModel)]="checkboxValues.option2"> Option 2
<input type="checkbox" [(ngModel)]="checkboxValues.option3"> Option 3在组件的类中，定义一个对象来存储复选框的选中状态，例如：
checkboxValues = {
option1: false,
option2: false,
option3: false
};这样，当用户选中或取消选中复选框时，对应的变量值会自动更新。
如果你想将多个复选框的值作为一个数组传递给后端，可以使用ngModelGroup指令来创建一个表单组，并使用ngModel指令绑定到一个数组变量上，例如：
<div ngModelGroup="checkboxGroup">
<input type="checkbox" [(ngModel)]="checkboxValues.option1"> Option 1
<input type="checkbox" [(ngModel)]="checkboxValues.option2"> Option 2
<input type="checkbox" [(ngModel)]="checkboxValues.option3"> Option 3
</div>在组件的类中，定义一个数组来存储复选框的选中状态，例如：
checkboxValues = {
checkboxGroup: []
};这样，当用户选中或取消选中复选框时，对应的值会自动添加或移除到数组中。
关于Angular的更多信息和示例，你可以参考腾讯云的Angular开发文档：Angular开发文档
相关·内容
我有多个复选框来(NgOninit).now我编辑这个复选框，有时我没有编辑我保存复选框时，它使this.checklist为空，但有一些复选框被选中，所以当我不编辑复选框时，如何将默认复选框放在this.checkedlist或任何其他解决方案是值得赞赏的。
浏览 9提问于2018-09-07得票数 0
回答已采纳
3回答
未选中复选框时如何禁用按钮
、、、、
我得到了以下的angular模板： <td><input type="checkbox"></td>
<td>{{user.username<button type="button" class="btn btn-danger"><i class="fa fa-trash-o"><&#
浏览 0提问于2015-11-08得票数 2
我正在使用ngFor动态生成多个复选框。但在这里，我需要一次启用一个复选框，如果选中一个复选框，则需要禁用另一个复选框。类似地，如果取消选中复选框，则需要启用其他复选框，。如何在angular2中实现这一点？= activeIndex"<
浏览 0提问于2018-09-03得票数 0
在我的angular js项目中，我有四个复选框。在四个复选框中，三个复选框具有三个条件(如ng-hide和ng-show)，其中一个复选框具有全选和取消选择所有条件。
一切都很正常。但最初，如果您选择，选中所有复选框一切都被选中，条件也正常工作(其他三个复选框也被选中)。但是稍后，如果您取消选中其他三个复选框(如</e
浏览 30提问于2020-06-08得票数 0
回答已采纳
我正在使用KendoUi angular 5。我需要如何在不使用Ctrl键的情况下选择多行，并在angular 5的kendogrid中选中复选框？我可以根据telerik kendo网格使用Ctrl键或选中复选框来选择多行，但我希望不使用Select复选框或Ctrl键来选择多行
浏览 0提问于2018-05-15得票数 1
我有一个angular应用程序，基本上当用户点击check me复选框时，我希望用户只能从选择列表中选择一个复选框。如果没有选中check me复选框，我希望用户能够选择多个复选框(当然是默认行为)。 我能够让用户只能选择一个复选框，但是我如何切换到他们可以返回的位置可以选中多个复选框？这是一个stackblitz https://stackblitz.com&
浏览 26提问于2019-08-22得票数 0
回答已采纳
2回答
如何在Yii中将搜索结果过滤为复选框和下拉列表的组合？我有一些类别，如复选框和预算的下拉列表，这是从数据库。选中多个复选框并从下拉列表中选择一个值时，如何筛选出搜索结果。。( WIth )有没有更好的办法?？(我的需求如此链接所示。 )
浏览 5提问于2013-04-02得票数 0
2回答
我有多个名称为adminMeta[]的复选框，如：<input type="checkbox当数据发布时，我正在使用foreach循环循环：在循环中，根据记录是否已经存在，在数据库
浏览 5提问于2017-08-11得票数 1
回答已采纳
5回答
有谁知道，如何处理复选框的RecyclerView滚动问题？
我在Recyclerview中使用多个复选框来扩展视图，在选中复选框之后，当我滚动Recyclerview时，选中的复选框将被取消选中。如何在Android的Recyclerview中防止复选框被取消选中？
浏览 2提问于2016-09-27得票数 1
1回答
在角4+中有一个反应性形式，其中有多个check boxes，如下所示：现在，用户可以选择尽可能多的复选框。因此，此表单的输出是选中的复选框的数组，如下所示： "I have a bike", "I have a test"我不知道如何在reactiveforms中处理这个问题。请注意
浏览 3提问于2018-01-06得票数 0
在我的页面中，有多个带有值的复选框。我从集合中获取这些值。我要接受特定选中的复选框总数。 }
如果我使用上面的代码，结果将显示错误，如无法将“System.String
浏览 5提问于2015-05-27得票数 1
回答已采纳
我正在尝试为Angular 7中的多个复选框应用去抖动时间。其想法是将API调用延迟x秒，以获得性能更好的应用程序(选中/取消选中复选框会调用API调用)。每个复选框对应于一个过滤器，当选中/取消选中时，该过滤器将发送到后端，并确定从服务器返回的结果。我已经尝试使用这里提到的文章https://coryry
浏览 15提问于2020-09-22得票数 0
如何在表头创建复选框以选中/取消选中一行中的所有复选框？如何一键选中一行中的复选框，以便编辑/删除记录？以及如何选择多个要删除的复选框？
浏览 4提问于2012-11-24得票数 2
回答已采纳
1回答
在常规的HTML文件中，我们可以像在html中一样，通过单击标签上的任意位置来选中复选框，即使将复选框输入显示设置为无 <input id="check"type="checkbox">为什么相同的在Angular中不起作用？我感兴趣的是如<e
浏览 0提问于2018-11-01得票数 0
2回答
Angular Datatable:如何在Datatable中动态获取检查值的总和。 有一个datatable和checkbox，一旦我们选中了选中的复选框，就需要对所有选中的复选框进行求和。如果我取消选中复选框，则需要减少未选中的框数。请建议问题。
浏览 51提问于2020-12-17得票数 0
回答已采纳
如何在angular js中为ng-disabled设置多个值？我的问题是用下面的JS小提琴解释的：<div ng-controller="myCnt">
<h3>A ->> <input type="checkbox"共有4个标记为A、B、Chkbox1和Chkbox2的复选框。我要找的是在<e
浏览 0提问于2013-08-16得票数 5
回答已采纳
1回答
我尝试在ng网格的列标题中实现一个复选框。这样做的目的是能够选中或取消选中给定列中的所有复选框。由于我希望将来有多个这样的列，所以我不想通过ng网格使用行选择复选框功能。如果您选中并取消选中行/数据部分中的复选框，则一切似乎都正常，这意味着如果选中所有复选框，标题中
浏览 0提问于2014-10-10得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
对象存储
即时通信 IM活动推荐
腾讯云开发者
