比select2 更好用的chosen插件 for angular

官网传送门在这里:

    

https://github.com/localytics/angular-chosen

 

首先angular app需要应用这个指令插件

var myApp = angular.module('myApp', [
    'ui.bootstrap', 
    'ngGrid',
    'localytics.directives' //angular-chosen组件

调用方法:

 <select> </select>//标签

简单的说下几个属性

       chosen

这个属性必须要有

data-placeholder="Pick one of these"

看这个名字应该知道啦?就是placeholder属性 不过是用input value模拟出来的

支持多选的话要加上

 multiple

 这个属性                           

            ng-model="tags"

//这个$scope.tags 数据类型是数组型 []

                                

这个是option选项数据结构

        ng-options="value as label for (value, label) in Datas"

数据结构:

$scope.Datas={key1:"value1",key2:"value2"}

是对象型而非数组型的哦

                                

最后附上参考,本人项目中的配置:

 <label class="control-label">Tags</label>
                            <div class="controls">
                                <select

                                        multiple
                                        ng-model="Datas.select_worktype"
                                        ng-options="value as label for (value, label) in Datas.wroktypes"
                                        chosen
                                        class="form-control">
                                </select>

                            </div>