Angular ng-repeat 排序为几个 div
佩佩加
我有一些代码，当前显示我的所有项目并按图标对它们进行排序。
<li ng-repeat="availableItem in model.availableItems | compareArrays:model.selectedItems:'alias' | orderBy:'icon' | filter:searchTerm"
ng-click="selectItem(availableItem)"
class="-three-in-row">
<a class="umb-card-grid-item" href="" title="{{ availableItem.name }}">
<i class="{{ availableItem.icon }}"></i>
{{ availableItem.name }}
</a>
</li>
我的目标是为每个图标类型（类别）创建一个 div 并将它们放置在 div 中，我如何才能以角度方式执行此操作？我已经尝试过 ng-if 但无法让它按照我想要的方式工作。所需的输出看起来像这样
滴滴涕
您可以使用 groupBy 过滤器并将 css 相应地应用于每个 li 标签。
<ul ng-repeat="(key, value) in stuff | groupBy: 'category'">
category name: {{ key }}
<li ng-repeat="item in value">
item: {{ item.name }}
</li>
</ul>
此外https://github.com/a8m/angular-filter是还有一个很好的资源，可以让你做更多的外部AngularJs框。
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
编辑于
相关文章
Related 相关文章
- 1
Angular JS。在ng-repeat中隐藏div
- 2
AngularJS：在ng-repeat中为div设置相同的高度
- 3
在Angular JS中跳过ng-repeat JSON排序
- 4
Angular ng-repeat问题
- 5
如何在Angular-UI模式中将ng-repeat与Div一起使用
- 6
折叠使用angular js ng-repeat和filter创建的div
- 7
使用Angular和ng-repeat将属性添加到HTML DIV
- 8
Angular JS-如何在ng-repeat中添加额外的DIV
- 9
折叠使用angular js ng-repeat和filter创建的div
- 10
Angular JS：无法在ng-repeat中为ng-model变量设置值
- 11
排序嵌套ng-repeat
- 12
在ng-repeat中创建父div
- 13
ng-repeat中的div无法更新？
- 14
ng-repeat内的ng-repeat，元素为同级
- 15
ng-repeat内的ng-repeat，元素为同级
- 16
使用ng-repeat时为div设置背景色
- 17
如何在Angularjs ng-repeat中为div使用Bootstrap工具提示
- 18
如果文本框为空则显示一个div（ng-repeat）
- 19
AngularJS - 如果 ng-repeat 为空并带有过滤器，则显示 div
- 20
如何在Angular JS ng-repeat中对1：1对象映射进行排序
- 21
如何在Angular JS ng-repeat中对1：1对象映射进行排序
- 22
Angular指令在ng-repeat上更新
- 23
Angular指令不被ng-repeat调用
- 24
Angular ng-repeat with array length condition
- 25
Angular js ng-repeat按键堆叠
- 26
Angular 1.5无法更新ng-repeat
- 27
ng-repeat Angular中递增的数字
- 28
Angular JS从静态变为ng-repeat
- 29
ng-repeat中的Angular img源
我来说两句