使用bootstrap-select插件实现下拉菜单多选,用ng获取后台数据,但是设置被选中的数据无法显示选中效果
在一个页面中,使用bootstrap和angular框架,需要实现一个下拉菜单多选的情况,于是找了一个bootstrap的插件——bootstrap-select。用ng从后台获取的数据,本来设置为被选中,但是无法显示被选中。贴图如下:
这三条选项用ng设置为selected的,但是现在显示“没有选中任何项”。而且点击选项,不会出现被选中效果“√”。下图是点击第一个选项的效果:
可以看出来,其实三个选项是被选中的,但是效果无法显示。第一个选项点击后被取消选中效果,二,三选项在选项框中显示出来了,但是“√”仍无法显示。
想要的效果为:
应该与ng的数据加载有关,求大神指导!
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(3)
想文献您这个功能是这么是怎么实现的啊,求教程,现在需要实现这样的一个功能。
你是怎么repeat的?贴出代码看看。
<select class="form-control" ng-model="member.memberType" id="memberType" name="memberType"
我这边只要给$scope.member.memberType = 1;就能回显出下拉框的值。
angular改变数组值后需要对组件进行手动刷新:
$('.selectpicker').val('Mustard');
$('.selectpicker').selectpicker('render');
上面的两个可以合并为:
$('.selectpicker').selectpicker('val', 'Mustard');
多选的话参数为数组,同时还有:
$('.selectpicker').selectpicker('selectAll');//选中所有
$('.selectpicker').selectpicker('deselectAll');//取消选中所有
.selectpicker应是指向select的选择器