有些时候我在angularjs中寻找多选复选框组选项。我无法在stackoverflow上找到自己,因为我已经开发了它并在这里分享js小提琴链接。
<div ng-app="check">
<div ng-controller="controller">
<ul>
<li ng-repeat="(key, item) in basket"> {{item.type}}
<ul>
<li ng-repeat="(sub_catkey, sub_catval) in item.fields">
<label>
<input type="checkbox" ng-model="sub_catval.checked" /> {{sub_catval.name}} -- {{sub_catval.checked}} | json
</label>
</li>
</ul>
</li>
</ul>
Selected show here
<li ng-repeat="(key, item) in basket"> {{item.type}}
<ul>
<li ng-repeat="(sub_catkey, sub_catval) in item.fields | filter: true">
<label>
{{sub_catval.name}} -- {{sub_catval.checked}}
</label>
</li>
</ul>
</li>
{Manager: {Name: filter.key}}
{{basket}}
angular.module(&#39; check&#39;,[]) .controller(&#39; controller&#39;,function($ scope){
$scope.basket = [
{
"type": "fruits",
"fields": [
{name: 'Apple', checked:false},
{name: 'Mango', checked:true},
{name: 'Banana', checked:false},
{name: 'Guava', checked:false},
{name: 'Orange', checked:false}
]
},
{
"type": "flowers",
"fields": [
{name: 'rose', checked:true},
{name: 'lilly', checked:false},
{name: 'tulip', checked:false},
{name: 'marigold', checked:false},
{name: 'sunflower', checked:false}
]
}
];
$scope.selected = {
fruits: ["Apple"],
flowers: []
};
$scope.checkAll = function() {
$scope.basket = angular.copy($scope.basket);
};
$scope.uncheckAll = function() {
$scope.selected.fruits = [];
};
});