话不多说,直接上干货。

肯定需要下拉选插件。必须引入的是   注意 先后顺序

select2.css
select2-bootstrap.css
select2.min.js
angular.min.js
angular-select2.js

ok,然后只需要写上一段代码就ok,如下
<input select2 select2-model="entity.brandIds"  config="brandList" multiple placeholder=" 选择品牌(可多选) " class="form-control">

解释一下什么意思,

select2-model 意思是你把选中的值都会自动放在这个变量上。放回的格式是[{"id":2,"text":"华为"},{"id":3,"text":"三星"}]
这种,很棒有没有!!!!
config  意思是下拉框的数据来源  必须符合格式:
$scope.config3 = {
data: [{id:1,text:'bug'},{id:2,text:'duplicate'},{id:3,text:'invalid'},{id:4,text:'wontfix'}]
// 其他配置略,可以去看看内置配置中的ajax配置
};
multiple 意思是可以多选

ok 大功告成
 

angularJs实现下拉框多选的更多相关文章

  1. jquery实现下拉框多选

    一.说明 本文是利用EasyUI实现下拉框多选功能,在ComboxTree其原有的基础上对样式进行了改进,样式表已上传demo,代码如下 二.代码 <!DOCTYPE html PUBLIC & ...

  2. combobox中动态加入几个checkbox,实现下拉框多选

    combobox中动态加入几个checkbox,实现下拉框多选,将一个checkbox选中时其内容就会在combobox中显示出来,将另一个checkbox选中时其内容会跟在第一个checkbox的内 ...

  3. Excel怎么下拉框多选

    打开Exlce, 确定,然后 右击查看代码,把这段代码复制到新建的文件里面 此时Excel会给出提示,选择否,,系统会提示保存,在保存的时候选择启用宏的工作簿然后保存,此时Excel下拉框多选就搞定了 ...

  4. vue实现下拉框全选和输入匹配

    实际项目中的一个需求: 点击文本框,弹出带有复选框的选项,然后获取选中项的数据,传给后面的一个功能.在文本框输入内容,也会动态的匹配下拉列表,并且列表带有全选功能. 朴素的效果图: 我选择了用vue实 ...

  5. easyui combotree下拉框多选赋值

    发现jquery.easyui.min.js 1.3.4版本的用setValues给多选下拉框赋值不成功,只能用1.3.1版本的 Html代码: <input id="ProductL ...

  6. checkboxlist 下拉框多选功能 ,模拟dropdownlist带复选框效果

    前台代码 01.<html xmlns="http://www.w3.org/1999/xhtml"> 02.<head runat="server&q ...

  7. ops-web运维平台-create.jsp-mootools下拉框-复选框

    create.jsp页面的,body部分 <body onload="Page.init('${pageError}','${pageMessage}',${isSubmit},tru ...

  8. 表id关联数据获取至页面,制作下拉框多选进行数据多项获取(字段处理)

     这周完成了一张表单,重点碰到以下问题: 1.freemaker获取年份的type值取year,类型直接为Long,传至后台和获取数据不需要转换: 2.freemaker获取日期type值为date, ...

  9. EasyUI combobox实现下拉框多选遇坑记录

    场景一: 多选正常从第二个选项增加逗号,我选第一个的时候就冒出一个逗号 解决方案一: 这是因为当前的下拉框的值可能为undefined,需要手动清空一下 $("#id").comb ...

随机推荐

  1. ES6 箭头函数易出错细节

    箭头函数表达式的语法比函数表达式更短,并且没有自己的this,arguments,super或 new.target. 箭头函数基本语法 (参数1, 参数2, -, 参数N) => { 函数声明 ...

  2. Asp.Net_获取IP地址

    //方法一 HttpContext.Current.Request.UserHostAddress; //方法二 HttpContext.Current.Request.ServerVariables ...

  3. 使用node-webkit(v0.35.5)和innosetup(3.6.1)打包将web程序打包为桌面客户端(安装包)

    这边主要是有一个客户,需要在电视机上安装一个客户端,含有视频直播功能:刚开始我们采用的webapp打包成apk安装在电视机上,发现摄像头监控画面根本无法播放(apk在手机上可以正常播放视频):排除一些 ...

  4. yocto-sumo源码解析(三):oe-setup-builddir

    该脚本的主要功能就是创建构建目录并准备一些配置文件,比如conf/local.conf,conf/bblayer.conf 1. 检测BUILDDIR环境变量是否设置好(在本系列分享第二节已经知道:B ...

  5. 普通程序员看k8s的账户管理

    一.知识准备 ● 账户管理分为:userAccount与serviceAccount ● userAccount:通常是给人设计使用的,并且userAccount不在k8s集群内管理 ● servic ...

  6. opencv2 用imwrite 抽取并保存视频图像帧

    最近在写一个车辆检测程序,程序中需要获取图像帧,并保存为图片,且放到指定目录中去,我在网上查了很多发现都是opencv1的有关操作,没有opencv2的操作,我参考网上的例子,结合着用opencv2新 ...

  7. 软件项目第一次sprint评分表

  8. Book Review 《构建之法》

    -首先浏览了一遍<构建之法>这本书的前言,其中通过客观的描述性介绍了学生与学习.老师与教学.以及学习的环境.方法等等.但是对于书中前言包括正文都频繁出现的一个词语 “文档” 深表疑问.何为 ...

  9. Alpha 冲刺报告模板

    Alpha 冲刺报告模板 Deadline: 十分钟左右站立会议,控制好时间,不要在此会议上讨论细节问题. 每组一份博客,组内共享,每人都需提交. 模板 队名:xxx 组员1(组长) 今天完成了哪些任 ...

  10. 重温redis命令

    redis是已知的性能最快的key-value 数据库. 1.key相关命令 exists key :检查指定的key是否存在 1表示存在 0表示不存在 del key1,key2,key3....: ...