Angularjs 使用选择值过滤列表数据
Angularjs filter list data using select value
我有以下格式的json数据:{ "id": "mypics-1", "imageThumbUrl": "img/small/1.jpg", "imageUrl": "img/large/1.jpg", "名称": "1.jpg", "类型": "imgage"}, { "id": "mypics-2", "imageThumbUrl": "img/small/2.jpg", "imageUrl": "img/large/2.jpg", "名称": "2.jpg", "类型":"图像"}
如果用户从下拉列表中选择一个值,我需要在类型基础上过滤图像列表。我的代码如下。我尝试了很多方法,但它没有过滤数据,而是清空了列表。
<select ng-model="showGenre">
<option value=" " selected>All</option>
<option ng-repeat="type in ImageTypes" value="{{type.name}}">{{type.name}}</option>
</select>
<div class="myPicsDivCls">
<ul id="carousel2" class="elastislide-list">
<li ng-repeat="ImageFile in ImageFiles | filter: {type:showGenre}">
<a>
<img ng-src="{{ImageFile.imageThumbUrl}}" data-echo="{{ImageFile.imageThumbUrl}}" alt="image06" />
</a>
</li>
</ul>
</div>
试试
<li ng-repeat="ImageFile in ImageFiles | filter: showGenre">
//----------编辑-----------//尝试
<li ng-repeat="ImageFile in ImageFiles | showGenre">
//----------编辑----------------//改变
<option value=" " selected>All</option>
自
<option value="" selected>All</option>
我认为是由于
相关文章:
- 条件过滤列表显示在angularjs中
- 如何在AngularJS中按变量过滤列表
- 在 Javascript 中过滤列表
- Ember - 绑定到数组控制器中的过滤列表,然后添加新记录
- Vue.js 1.0.15 过滤列表无法读取未定义的属性
- 过滤列表并通过 ajax 请求数据
- Angularjs 使用选择值过滤列表数据
- 点击Angular过滤列表中的函数
- Angular.js可过滤列表,通过选择字段和可点击地图预定义值
- AngularJS-我应该如何处理多个动态下拉列表来过滤列表
- 如果过滤函数是异步的,如何使用lodash过滤列表
- 过滤列表与子字符串javascript
- AngularJS在数组的子元素上过滤列表
- 按首字母过滤列表项
- jQuery mobile:处理大型过滤列表
- JQuery排序和过滤列表
- 如何在过滤列表中使用第n子节点
- 通过侧边栏过滤列表
- 显示'没有项目'使用jQuery插件过滤列表项时的消息
- ng-从过滤列表中删除时重复动画