nya-bootstrap-select
An AngularJS directive wrapper for silviomoreto's Bootstrap-select, which supports ngRepeat
in options to dynamically build a Bootstrap-select.
Requirements: AngularJS 1.0+, jQuery 1.7+, Bootstrap-select 1.3+
Usage
- install via bower
$ bower install nya-bootstrap-select
- include the nyaBootstrapSelect module as a dependency for your app.
angular.module('myApp', ['nya.bootstrap.select'])
-
include the bootstrap-select js and css file in your html.
-
Create your
<select>
with the.nya-selectpicker
class or 'nya-selectpicker' attribute. You can usengRepeat
orngOptions
directive to generate<option>
. 'ngRepeat' directive is only preferred to use in simple situations. ngOptions is a good choice for generating both<option>
and<optgroup>
. if you use ng-repeat to generate youroption
tags. add anng-model
directive to bind a model to your<select>
. In order to update the model according to your select, your should bindvalue
with your models.
<select class="nya-selectpicker" ng-model="myModel">
<option ng-repeat="option in options" value="{{option}}">{{option}}</option>
</select>
ngOptions
example:
<select class="nya-selectpicker" ng-model="myModel" ng-options="c.name for c in options">
</select>
Note that you shouldn't use both two method at same time.
- init your options model. you can retrieve your model from server any time. when options model changes.
ng-repeat
will update the<option>
s. nya-bootstrap-select directive will update your select as well.
$scope.options = ['alpha', 'bravo', 'charlie'];
- Fire up your angular app.
License
Licensed under the MIT license