根据AngularJS中的多个条件更改复选框状态

Question

在我的场景中，我有一个选择下拉列表，并为其分配了ng-model。 下拉列表中的每个项目对应于在进行选择时检查的多个复选框。 困难在于我不能只检查一个简单的密钥：值因为复选框不是任何特定选择所独有的。 例如：

<select>
  <option>Dog</option>
  <option>Cat</option>
  <option>Bird</option>
</select>

<input type="checkbox">Is an animal
<input type="checkbox">Can bark
<input type="checkbox">Can meow
<input type="checkbox">Can tweet
<input type="checkbox">Has four legs
<input type="checkbox">Has wings

尽可能地，“Is a animal”和“Has four legs”的复选框不是唯一的。 我当前的实现使用一个简单的条件表达式来评估复选框是否被标记（ng-checked =“animal =='dog'”），但当然这排除了其他两种可能性。 所以我想知道是否有一种原生的Angular方式来处理OR语句或数组。 或者如果没有，我如何使用JavaScript或jQuery进行此操作？

Answer 1

看到这个小提琴： http ： //jsfiddle.net/QHza7/

模板：

<div ng-app ng-controller="Test">
    <select ng-model="opts" ng-options="a.opts as a.name for a in answers"></select>
    <br/>
    <input type="checkbox" ng-model="opts.animal" />Is an animal<br/>
    <input type="checkbox" ng-model="opts.bark" />Can bark<br/>
    <input type="checkbox" ng-model="opts.meow" />Can meow<br/>
    <input type="checkbox" ng-model="opts.tweet" />Can tweet<br/>
    <input type="checkbox" ng-model="opts.legs4" />Has four legs<br/>
    <input type="checkbox" ng-model="opts.wings" />Has wings<br/>
</div>

码：

function Test($scope) {
    $scope.answers = [
        {name:"Dog", opts:{animal:true,bark:true,legs4:true}},
        {name:"Cat", opts:{animal:true,meow:true,legs4:true}},
        {name:"Bird", opts:{animal:true,tweet:true,wings:true}}
    ];
    $scope.opts = null;
}