I am new to AngularJS, and am thus confused as how to bind checkboxes or multi-select dropdowns to a separate list.
<body ng-controller="FooListCtrl">
<span ng-repeat="foolist in foos">
<select ng-model="selected" ng-options="foo for foo in foolist" multiple="">
</select>
</span>
</body>
'use strict';
function FooListCtrl($scope) {
$scope.foos = {"Bar": [ "foo", "bar"]};
$scope.selected = [];
}
FooListCtrl.$inject = ['$scope'];
Run the code: /
I am new to AngularJS, and am thus confused as how to bind checkboxes or multi-select dropdowns to a separate list.
<body ng-controller="FooListCtrl">
<span ng-repeat="foolist in foos">
<select ng-model="selected" ng-options="foo for foo in foolist" multiple="">
</select>
</span>
</body>
'use strict';
function FooListCtrl($scope) {
$scope.foos = {"Bar": [ "foo", "bar"]};
$scope.selected = [];
}
FooListCtrl.$inject = ['$scope'];
Run the code: http://jsfiddle/gBcN2/
Share Improve this question asked May 20, 2013 at 8:08 Foo StackFoo Stack 2,3257 gold badges25 silver badges25 bronze badges1 Answer
Reset to default 2If I got right what you want:
- You don't have
ng-app
definition. - On jsFiddle for snippets of AngularJS put
No wrap - in <head>
load mode, if you are using AngularJS as external resource. - Model
selected
has it's own "range", because you useng-repeat
. To see what I mean, here is fixed version of your code: http://jsfiddle/gBcN2/2/
First {{selected}}
works fine, but second is "outside" of ng-repeat
scope.
PS:
You don't have to use ng-repeat
if you want to use it like you wrote in your example: quick fiddle of how I'd do it.
Edit:
For checkboxes it's something like that - http://jsfiddle/qQg8u/2/