wan-select

component

主题

  基于angular material的可搜索多选控件。

详情

选择的数据：

配置文件如下：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
angular
  .module('demoWan', [
    'ngMaterial',
    'fc.dateRange',
    'fc.wanSelect'
  ]).controller('DemoCtrl', DemoCtrl);

function DemoCtrl($scope) {
  $scope.startDate = "2015-07-07";
  $scope.endDate = "2015-07-27";
  $scope.dateLength = 0;

  $scope.sourceData = ["中国", "日本", "蒙古", "北韩", "朝鲜", "韩国", "缅甸", "文莱", "柬埔寨", "东帝汶", "印度尼西亚", "寮国", "老挝", "马来西亚", "菲律宾", "新加坡", "泰国", "越南"];
  $scope.selectedData = [];

  $scope.selectChanged = function(){
    jQuery("#wan-selected-data").html($scope.selectedData.join('，'));
  };
}

HTML文件如下：

1
2
3
4
5
<wan-select placeholder="国家：" 
            source-data="sourceData" 
            selected-data="selectedData" 
            select-changed="selectChanged()">
</wan-select>

Options:

placeholder: string
source-data: array，源数据
selected-data: array，选中的数据
select-changed: 事件，选中的Array改变时触发