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

亚姆萨尔

在我的场景中,我有一个选择下拉列表,其中分配了一个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'”),但是当然,这排除了其他两种可能性。所以我想知道是否存在本机Angular处理OR语句或数组的方式。否则,我该如何使用JavaScript或jQuery做到这一点?

尼科斯(Nikos Paraskevopoulos)

看到这个小提琴: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;
}

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

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

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

更改输入复选框AngularJS的状态

来自分类Dev

根据其他复选框状态更改内容控件复选框的状态

来自分类Dev

根据复选框状态更改标签的颜色

来自分类Dev

更改复选框状态

来自分类Dev

复选框更改状态

来自分类Dev

根据ReactJS中的变量有条件地设置复选框状态

来自分类Dev

根据多个复选框条件过滤数组

来自分类Dev

单击复选框后,React应用程序中的复选框未更改状态

来自分类Dev

复选框:通过Ajax更改复选框的状态

来自分类Dev

使用useState更新React中多个复选框的状态

来自分类Dev

根据条件在表格中添加复选框

来自分类Dev

根据屏幕尺寸更改Bootstrap中的复选框标签

来自分类Dev

根据屏幕尺寸更改Bootstrap中的复选框标签

来自分类Dev

根据文本获取复选框的状态

来自分类Dev

根据AngularJS中字段的值绑定复选框

来自分类Dev

选中多个复选框状态

来自分类Dev

选中多个复选框状态

来自分类Dev

多个复选框的发布状态

来自分类Dev

angularjs中列表的多个复选框选择

来自分类Dev

从代码更改Switchery复选框状态

来自分类Dev

Flutter复选框状态更改

来自分类Dev

使用 setState 更改复选框的状态

来自分类Dev

根据复选框值更改文本

来自分类Dev

基于复选框的多个SQL条件

来自分类Dev

AngularJS的更改复选框推送$索引

来自分类Dev

根据多个复选框的选择,使用javascript将“ mailto:”链接更改为“ mailto:多个变量”

来自分类Dev

如何通过选中Microsoft Lightswitch中的另一个复选框来更改复选框的状态

来自分类Dev

如何基于AngularJs中的另一个复选框状态选择复选框?

来自分类Dev

如何根据被检查的复选框状态更新状态

Related 相关文章

热门标签

归档