角4检查多个复选框
角4检查多个复选框
提问于 2017-10-09 12:33:52
我有一个表单，其中的用户角色显示为多个复选框：
<div *ngFor="let role of roles">
<label for="role_{{role.id}}">
<input type="checkbox" ngModel name="roles" id="role_{{role.id}}" value="{{role.id}}"> {{role.name}}
</label>
</div>从服务器加载的roles对象如下所示，其中包含窗体上显示的所有角色：
{id: 1, name: "HQ", description: "A Employee User", created_at: "2017-10-07 10:43:17",…}
1
:
{id: 2, name: "admin", description: "A Manager User", created_at: "2017-10-07 10:43:17",…}
2
:
{id: 3, name: "caretaker", description: "", created_at: null, updated_at: null}现在我想使用form.setValue设置多个复选框，从服务器加载的用户对象如下所示:用户对象中的“角色”是分配给用户的角色，需要在表单上进行检查。
{
"id":13,
"name":"Wasif Khalil",
"email":"wk@wasiff.com",
"created_at":"2017-10-07 10:43:17",
"updated_at":"2017-10-09 07:45:34",
"api_token":"LKVCGPGnXZ3LyiCnyiTAg8XTpck6xWlVkeoMBgtoYZWoAOy4b5epNqMz7KG7",
"roles":[
{"id":2,"name":"admin","description":"A Manager User","created_at":"2017-10-07 10:43:17","updated_at":"2017-10-07 10:43:17","pivot":{"user_id":"13","role_id":"2","created_at":"2017-10-07 10:43:17","updated_at":"2017-10-07 10:43:17"}
},
{"id":1,"name":"HQ","description":"A Employee User","created_at":"2017-10-07 10:43:17","updated_at":"2017-10-07 10:43:17","pivot":{"user_id":"13","role_id":"1","created_at":null,"updated_at":null}
}
]
}加载用户对象表单服务器im设置值后，如下所示：
this.form.setValue({
name: user.name,
email: user.email,
password:"",
confirm_password:"",
roles: [1] //here im not sure how to set roles
});有人能帮我检查带有加载的用户角色对象的复选框吗？提前感谢
编辑:对不起，我没有很好地解释这个问题，我编辑了我的问题，再次解释了这个问题:用户对象上的角色是分配给用户的角色，角色对象是要以形式显示的所有角色的列表，请看下面的图像：
回答 1
Stack Overflow用户
回答已采纳
发布于 2017-10-09 14:12:17
您不需要使用反应形式来完成它。
<input ...[checked]="check(user.roles,role.id)" ...>打字本：
check(value1, value2){
return (value1.filter(item => item.id == value2)).length
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/46646576
复制相关文章
相似问题
腾讯云开发者
