typeahead-pro指令

typeahead-pro指令：

按照输入匹配相应的项，显示在下拉列表中

Paste_Image.png

使用方法：
1，引入angular.virgo.js

<script src="#{cdnPath}/virgo/2.0.1/js/angular.virgo.js" ></script>

2，写标签

<typeahead-pro width="120" input-class="'form-control'" style="display: inline-block" key-model="vm.bucketCode" th="thBucketCode"/>

3，配置属性

$scope.thBucketCode = {
    title: 'bucketName',      //title-model对应的字段
    key: 'bucketCode',        //key-model对应的字段
    prompt: 'Bucket代码',     //placeholder
    hidebutton: true,
    services: ossService,
    method: "queryBucket",    //默认query
    cache: true,              //是否使用缓存，如果不使用，将一次性取出全部数据，如果使用，将在每次输入后到后台查询
    display: 'key',           //显示在文本框中的字段
    getOptions: function () {
        //查询条件
        //return { rows: 100};
    },
    selectItem: function (item) {
        //选择完成后触发
        //$scope.query();
    }
};

select-from-list指令：

一个文本框加按钮的组合，点击显示弹窗，弹窗中显示一个列表，提供可选择的项，选择完毕后点击确定可将需要的内容回填至文本框中。

Paste_Image.png

使用方法：

1，引入angular.virgo.js

<script src="#{cdnPath}/virgo/2.0.1/js/angular.virgo.js" ></script>

2，写标签

<!--默认size20-->
<select-from-list ng-model="vm.bucketCode"  btn-class="'btn-sm'" input-class="'form-control input-sm'"  size="16" sfl-config="sflBucketCode" />

3，配置属性

$scope.sflBucketCode = {
    services: ossService,
    method: "queryBucket",                       //默认method：query
    datafield: [{ text: 'Bucket代码', field: 'bucketCode' }, { text: 'Bucket名称', field: 'bucketName' }],//数据字段
    searchfield:  [{ text: 'Bucket名称', field: 'bucketName' }],//查询字段
    field: 'bucketCode',                         //返回值是哪个字段
    //multi: true,                               //是否允许多选，默认单选
    //rows:10,                                   //列表每页行数，默认10行
    title: '选择Bucket',                         //dialog标题
    //btntext:'选择',                            //按钮文字
    getOptions: function () {
        return {
            code_type:'T514'
        };
    },
    selectItem: function (item) {
        //item返回选择的数据
        //vm.bucketCode = item[0].bucketCode;
        $scope.query();
        // console.log(item[0].bucketCode)
    }
};