Question

我的名单中充满了过敏＆＃39;它从Web服务获取。所以过敏可能看起来像这样：

 <li class="item item-checkbox" ng-repeat="allergy in formData.allergies">
   <label class="checkbox">
     <input type="checkbox" name="selectedAllergies" value="allergy.id">
   </label>
   {{allergy.description | uppercase}}
 </li>

然后用于填充复选框输入列表：

console.log($scope.selectedAllergies);

但是我在如何找出用户实际选择的内容方面苦苦挣扎？在用户选择了几个之后执行此操作：

undefined

只返回<bean id="ListOfValuesDao" class="be.fgov.just.cjr.dao.core.ListOfValuesDaoImpl"> <property name="sessionFactory" ref="sessionFactory"/> </bean> ...

Answer 1

您的复选框输入有一个值（它将设置模型的内容）但没有ng-model，所以它不知道如何处理这个值。

我认为最简单的方法是修改过敏症数组，因此您可以使用以下代码：

<li class="item item-checkbox" ng-repeat="allergy in formData.allergies">
    <label class="checkbox">
        <input type="checkbox" name="selectedAllergies" ng-model="allergy.selected">
    </label>
    {{allergy.description | uppercase}}
</li>

根据复选框状态，没有任何值，allergy.selected应设置为truthey或falsey值。

Answer 2

您需要在ng-model元素中添加<input>才能进行绑定

<input ng-model="allergy.checked" type="checkbox">

然后在控制器中将其初始化为

$scope.formData.allergies = [
  {
    'id' : 1, 
    'description' : 'Potassium Cyanide',
     'checked' : false
  },
  {
    'id' : 2, 
    'description' : 'Blue ring octopus',
     'checked' : false
  },
  {
    'id' : 3, 
    'description' : 'Poison dart frog',
     'checked' : false
  },
];

最初所有这些状态都处于未检查状态，当用户选中一个复选框时（例如第一个），$scope.formData.allergies[0].checked的值将为true

使用AngularJS中的复选框时遇到一些困难

2 个答案: