首页 > 解决方案 > Angular:根据单选按钮值更改更改复选框的选中状态

问题描述

我想根据单选按钮的值检查所有选中的框,反之亦然未选中的单选按钮单击。我正在尝试通过以下方式实现它。但我不能这样做。

组件 HTML

   <label class="radio-inline">
        <input type="radio" name="sel" value="0" [(ngModel)]="clientSelectionType">Select All 
    </label>

      <label class="radio-inline">
        <input type="radio" name="sel" value="1" [(ngModel)]="clientSelectionType">Unselect All
    </label>

<div class="form-group">
    <h3> radio button </h3>
    <label class="radio-inline">
        <input type="checkbox" [checked]="clientSelectionType===0"> Test 1
    </label>
    <label class="radio-inline">
        <input type="checkbox" [checked]="clientSelectionType===0"> Test 2
    </label>
     <label class="radio-inline">
        <input type="checkbox" [checked]="clientSelectionType===0"> Test 4
    </label>
    <label class="radio-inline">
        <input type="checkbox" [checked]="clientSelectionType===0"> Test 3
    </label>
</div> 

StackBlitzLink:https ://stackblitz.com/edit/angular-ffuhsz 。我怎样才能做到这一点?

标签: angulartypescript

解决方案


问题是stringvsnumber比较。你在做什么clientSelectionType === 0,这是'0' === 0。它是一个字符串的原因是因为您正在绑定这样的值:value="1"在收音机上。这会产生一个字符串值。尝试使用绑定括号的值:

<input type="radio" name="sel" [value]="1" [(ngModel)]="clientSelectionType">

推荐阅读