multiple default select with ng-model and ng-repeat
Question
<script src="" https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js ""></script>
<script>
var app = angular.module('role', []);
app.controller('fooController', function($scope) {
$scope.roles = [{
id: 1,
name: "Administrator"
}, {
id: 2,
name: "Student"
}, {
id: 3,
name: 'worker'
}];
$scope.user = {};
$scope.value=function(){
$scope.user = [name:'abc',roles:[{
id: 2,
name: 'Student'
}, {
id: 3,
name: 'worker'
}];
}
});
</script>
<body>
<button type="button" ng-click="value()">Click me </button>
<form ng-repeat="test in user">
<input type="text" ng-model="test.name">
<select multiple class="form-control" data-ng-model="user.roles" required>
<option ng-repeat="role in roles" value="{{role.id}}">{{role.name}}</option>
</select>
</body>
I want to bind the select values by defalut with ng-model i want to use only ng-repeat not ng-options by default it sholud select the values in the $scope.user.roles values
2 answers
solution1
1 2017-04-04 11:45:45
How about this.?
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> <script> var app = angular.module('role1', []); app.controller('fooController', function($scope) { $scope.roles = [{ id: 1, name: "Administrator" }, { id: 2, name: "Student" }, { id: 3, name: 'worker' }]; $scope.user = {}; $scope.user.roles = [{ id: 2, name: 'Student' }, { id: 3, name: 'worker' }]; $scope.user.roles.id = $scope.user.roles.map(function(a) { return a.id; }); }); </script> <body ng-app="role1" ng-controller="fooController"> <select multiple class="form-control" data-ng-value="user.roles" required> <option ng-repeat="role in roles" ng-selected="user.roles.id.indexOf(role.id) != -1" value="{{role.id}}">{{role.name}}</option> </select> </body>
solution2
0 2017-04-04 11:20:43
Maybe this will help you:
<select multiple class="form-control" data-ng-model="user.roles" required>
<option ng-repeat="role in roles" value="{{role.id}}" ng-selected="{{user.roles.indexOf(role) !== -1}}">{{role.name}}</option>
</select>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.
Related Question
Cannot select default value in dropdown using ng-model and ng-repeat or ng-select in AngularJS
AngularJS select default value with ng-model and ng-repeat instead ng-option
ng-model with association on select box with ng-repeat on options
Watch ng-model in multiple nested ng-repeat
using ng-model in ng-repeat
how to ng-model in ng-repeat?
Dynamic ng-model with ng-repeat
ng-repeat variables to ng-model
Dynamic ng-model in ng-repeat
Angularjs select with ng-repeat, on select bind ng-model with object
Related Tags