I used Bootstrap Multiselect Dropdown http://davidstutz.github.io/bootstrap-multiselect/ & embed into the sub-template of AngularJS & let it run with the following function:
$scope.$on('$viewContentLoaded', function () {
$(document).ready(function() {
$('#example27').multiselect({
includeSelectAllOption: true
});
});
});
I continued using ng-repeat to print the inside options of this input select:
<select id="example27" multiple="multiple">
<option ng-repeat="list in lists" value="{{list.id}}">{{list.name}}</option>
</select>
But when ng-repeat is in this input select, it did not work & didn't print any data. Anybody knows how to solve this problem, please help me!!
If you use bootstrap-multiselect you should use ng-options attribute, like in @user2598687 answer. Here version of fiddle that works with firefox: click me to jsfiddle
<select class="multiselect" data-placeholder="Select Products"
ng-model="productSelection" ng-options="item.id as item.name for item in Products"
multiple="multiple" multiselect-dropdown >
$scope.Products = [{id:1,name:"Apple"}, {id:2,name:"Banana"}, {id:3,name:"Carrort"}, {id:4,name:"Dart"}];