AngularJS toArray将对象键转换为数字

发布时间：2020-12-17 17:38:31 所属栏目：安全来源：网络整理

导读：我在我的项目中使用角度过滤器按页面对输出对象进行排序问题是当我使用这样的语法时： ul class="catalog-list" ng-repeat="(key,value) in list | groupBy: 'styl' | toArray | orderBy:'page'" {{key}} li ng-repeat="dziecko in value | filter:search |

我在我的项目中使用角度过滤器按页面对输出对象进行排序问题是当我使用这样的语法时：

<ul class="catalog-list"
    ng-repeat="(key,value) in list | groupBy: 'styl' | toArray | orderBy:'page'">

  {{key}}

  <li ng-repeat="dziecko in value | filter:search | bookmark:search" 
      ng-class="{active:isActiveTab(dziecko)}"
      ng-click="openItem(dziecko)">
    {{dziecko.rodzina}}
    <b>{{dziecko.page}}</b>
  </li>
</ul>

Angular将’styl’属性[‘nowoczesny’,’klasyczny’..]转换为数字.排序工作正常,但我想获取名称而不是数字.

解决方法

groupBy返回一个对象,orderBy将数组作为参数,这就是你应该使用toArray过滤器的原因.

toArray这样的工作：
用法：对象| toArray：addKey [可选]
如果addKey设置为true,则过滤器还会将新属性$key附加到包含我们正在迭代的对象中使用的原始键的值以引用该属性

所以,你可以做这样的例子,或者看看jsbin

JS：

$scope.groups = [
    { category: 'alpha',id: 2 },{ category: 'beta',id: 3 },{ category: 'gamma',id: 0 },{ category: 'alpha',id: 4 },id: 5 },id: 1 }
   ];

HTML：

<ul ng-repeat="group in groups | groupBy:'category' | toArray:true | orderBy:min">
    <!-- print the group name -->
    <li>{{ group.$key }}</li>
    <!-- iterate over the group members and order each group by id -->
    <li ng-repeat="item in group | orderBy:'id'">
      {{ item }}
    </li>
</ul>

结果：

>阿尔法> {“category”：“alpha”,“id”：2}> {“category”：“alpha”,“id”：4}> beta> {“category”：“beta”,“id”：3}> {“category”：“beta”,“id”：5}>伽马> {“category”：“gamma”,“id”：0}> {“category”：“gamma”,“id”：1}

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!