angularjs md 复选框获取选中的值答案

【问题标题】：angularjs md checkbox get the checked valuesangularjs md 复选框获取选中的值
【发布时间】：2017-05-09 17:19:30
【问题描述】：

<md-checkbox ng-repeat="primaryPrograms in ctrl.primaryProgramStudies" ng-model="ctrl.primaryProgramStudiesSelected[primaryPrograms.id]">
  {{primaryPrograms.name}}
</md-checkbox>

选中的复选框：

{{ctrl.primaryProgramStudiesSelected | json}}

我得到的输出：

Selected Checbox : 
[null,true,true,true,null,true,null,true,null,true,null,null,true]

如何获得检查值列表。

【问题讨论】：

我的解决方案对你有用吗？
您能否提供一些参考链接，说明如何在加载时显示选中的复选框。

标签： javascript angularjs arrays checkbox selected

【解决方案1】：

可以根据ctrl.primaryProgramStudiesSelected上的同一个索引是否有true来过滤原始数组ctrl.primaryProgramStudies

var ctrl = {};

ctrl.primaryProgramStudies = [{
    "name": "test0",
    "id": 0
  },
  {
    "name": "test1",
    "id": 1
  },
  {
    "name": "test2",
    "id": 2
  },
  {
    "name": "test3",
    "id": 3
  },
  {
    "name": "test4",
    "id": 4
  },
  {
    "name": "test5",
    "id": 5
  },
  {
    "name": "test6",
    "id": 6
  },
  {
    "name": "test7",
    "id": 7
  },
  {
    "name": "test8",
    "id": 8
  },
  {
    "name": "test9",
    "id": 9
  },
  {
    "name": "test10",
    "id": 10
  },
  {
    "name": "test11",
    "id": 11
  },
  {
    "name": "test12",
    "id": 12
  }
]

ctrl.primaryProgramStudiesSelected = [null, true, true, true, null, true, null, true, null, true, null, null, true]

ctrl.selectedValues = ctrl.primaryProgramStudies.filter(function(obj, index) {
  return ctrl.primaryProgramStudiesSelected[index] === true
})

console.log(ctrl.selectedValues)

【讨论】：

【解决方案2】：

您可以使用filter 方法，它接受callback 方法作为参数。

filter() 方法创建一个新的array，其中包含通过provided(callback) 函数实现的测试的所有元素。

var array=[null,true,true,true,null,true,null,true,null,true,null,null,true];
ctrl.primaryProgramStudies.filter(function(item,index){
    return array[index]==true;
});

简短的例子

var ctrl = {};

ctrl.primaryProgramStudies = [{
    "name": "program0"
  },
  {
    "name": "program1"
  },
  {
    "name": "program2"
  },
  {
    "name": "program3"
  },
  {
    "name": "program4"
  },
  {
    "name": "program5"
  },
  {
    "name": "program6"
  },
  {
    "name": "program7"
  },
  {
    "name": "program8",
  },
  {
    "name": "program9",
  },
  {
    "name": "program10",
  },
  {
    "name": "program11",
  },
  {
    "name": "program12"
  }
]

ctrl.primaryProgramStudiesSelected =[null,true,true,true,null,true,null,true,null,true,null,null,true];
var result=ctrl.primaryProgramStudies.filter(function(item,index){
     return ctrl.primaryProgramStudiesSelected[index]==true;
});

console.log(result)

【讨论】：