Angular 2使用ngFor设置和绑定复选框

塞雷尼

我有一个像这样的数组:

 objectArray = [
        {"name": "Car"},
        {"name": "Bike"},
        {"name": "Boat"},
        {"name": "Plane"}
    ];

和这样的模板:

<li *ngFor="#obj of objectArray">
   <a href="#" class="small" data-value="option1" tabIndex="-1">
      <input type="checkbox" (change)="expression && expression.value = $event.target.checked ? true : undefind" [ngModel]="expression?.value">
      <label for="">{{ obj.name }}</label>
   </a>
</li>

但是,当1个复选框被选中,这是设置为true。如何分别设置?

贡特·佐赫鲍尔(GünterZöchbauer)

我想这就是你想要的:

<li *ngFor="let obj of objectArray">
   <a href="#" class="small" data-value="option1" tabIndex="-1">
<input type="checkbox"  
    (change)="expression && expression[obj.name]=$event.target.checked ? true : undefined"
    [ngModel]="expression && expression[obj.name]">
   </a>
</li>

更新使用(ngModelChange)通常比更好是(change)特别是如果[ngModel]使用

<input type="checkbox"  
    (ngModelChange)="expression && expression[obj.name]= $event ? true : undefined"
    [ngModel]="expression && expression[obj.name]">

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

Angular 2使用ngFor设置和绑定复选框

来自分类Dev

ionic2 Angular 2绑定复选框,并在窗体内添加ngFor

来自分类Dev

在ngFor Angular 2中的输入类型复选框上设置检查状态

来自分类Dev

在ngFor Angular 2中的输入类型复选框上设置检查状态

来自分类Dev

Angular2 - 带有多个复选框的 NgFor

来自分类Dev

Angular2是否可以使用带有复选框的双向绑定?

来自分类Dev

Dart Angular2-使用复选框值将组件布尔值绑定

来自分类Dev

无法使用Angular2将Style.Top绑定到单击的复选框的坐标

来自分类Dev

在 Angular 6 上为 *ngFor 内的输入类型复选框启用双向数据绑定

来自分类Dev

在Angular 2中使用管道过滤复选框

来自分类Dev

在Angular 2中使用管道过滤复选框

来自分类Dev

如何使用 Angular 2 中的复选框删除多行?

来自分类Dev

使用ng-click重置Angular复选框,以重置绑定到该复选框的ng-model,从而防止取消选中该复选框

来自分类Dev

Angular 2复选框preventDefault

来自分类Dev

Angular 2 杠杆复选框输入

来自分类Dev

Angular 2 复选框值

来自分类Dev

使用Angular获取复选框的价值

来自分类Dev

使用 Angular 字段绑定访问复选框的“已选中”状态

来自分类Dev

使用Angular.js选中复选框时如何设置输入字段值

来自分类Dev

如何使用angular js根据数据库中的值设置复选框的选中属性

来自分类Dev

Angular patchValue() 复选框

来自分类Dev

Angular 2 - 复选框列表 - 如何检查复选框的状态

来自分类Dev

Angular和JSON API中的动态复选框列表

来自分类Dev

Angular JS复选框使用$ watch来计数选中的复选框

来自分类Dev

使用Angular禁用“提交”按钮,直到选中2或3个复选框

来自分类Dev

Angular 2使用模板中的复选框值启用组件中的输入框

来自分类Dev

使用 Angular 2 反应形式通过单个复选框提交多个值

来自分类Dev

无法使用 angular 2+ 中的复选框进行过滤

来自分类Dev

Angular 2复选框选中所有

Related 相关文章

  1. 1

    Angular 2使用ngFor设置和绑定复选框

  2. 2

    ionic2 Angular 2绑定复选框,并在窗体内添加ngFor

  3. 3

    在ngFor Angular 2中的输入类型复选框上设置检查状态

  4. 4

    在ngFor Angular 2中的输入类型复选框上设置检查状态

  5. 5

    Angular2 - 带有多个复选框的 NgFor

  6. 6

    Angular2是否可以使用带有复选框的双向绑定?

  7. 7

    Dart Angular2-使用复选框值将组件布尔值绑定

  8. 8

    无法使用Angular2将Style.Top绑定到单击的复选框的坐标

  9. 9

    在 Angular 6 上为 *ngFor 内的输入类型复选框启用双向数据绑定

  10. 10

    在Angular 2中使用管道过滤复选框

  11. 11

    在Angular 2中使用管道过滤复选框

  12. 12

    如何使用 Angular 2 中的复选框删除多行?

  13. 13

    使用ng-click重置Angular复选框,以重置绑定到该复选框的ng-model,从而防止取消选中该复选框

  14. 14

    Angular 2复选框preventDefault

  15. 15

    Angular 2 杠杆复选框输入

  16. 16

    Angular 2 复选框值

  17. 17

    使用Angular获取复选框的价值

  18. 18

    使用 Angular 字段绑定访问复选框的“已选中”状态

  19. 19

    使用Angular.js选中复选框时如何设置输入字段值

  20. 20

    如何使用angular js根据数据库中的值设置复选框的选中属性

  21. 21

    Angular patchValue() 复选框

  22. 22

    Angular 2 - 复选框列表 - 如何检查复选框的状态

  23. 23

    Angular和JSON API中的动态复选框列表

  24. 24

    Angular JS复选框使用$ watch来计数选中的复选框

  25. 25

    使用Angular禁用“提交”按钮,直到选中2或3个复选框

  26. 26

    Angular 2使用模板中的复选框值启用组件中的输入框

  27. 27

    使用 Angular 2 反应形式通过单个复选框提交多个值

  28. 28

    无法使用 angular 2+ 中的复选框进行过滤

  29. 29

    Angular 2复选框选中所有

热门标签

归档