1

私のシナリオでは、ng-model が割り当てられた選択ドロップダウンがあります。ドロップダウンの各項目は、選択時にチェックされるチェックボックスの数に対応しています。問題は、チェックボックスが特定の選択に排他的ではないため、単純な key:value をチェックできないことです。例えば：

<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

可能な限り、「動物です」と「四本足」のチェックボックスは排他的ではありません。私の現在の実装では、単純な条件式を使用して、チェックボックスがマークされているかどうかを評価します (ng-checked="animal=='dog'") が、もちろんこれは他の 2 つの可能性を除外します。したがって、OR ステートメントまたは配列を処理するネイティブの Angular の方法があるかどうか疑問に思っています。または、そうでない場合、JavaScript または jQuery を使用してこれを行うにはどうすればよいですか?

4

1 に答える 1

4

このフィドルを参照してください: 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;
}
于 2013-09-23T14:02:17.983 に答える