AngularJS toArray将对象键转换为数字

时间:2014-12-15 11:04:40

标签: angularjs filtering

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

<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>

角度转换&#39; styl&#39;属性[&#39; nowoczesny&#39;,&#39; klasyczny&#39; ..]到数字。排序工作正常,但我想获取名称而不是数字。

2 个答案:

答案 0 :(得分:5)

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

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

所以,您可以执行类似示例的操作,或查看jsbin

<强> JS:

$scope.groups = [
    { category: 'alpha', id: 2 },
    { category: 'beta',  id: 3 }, 
    { category: 'gamma', id: 0 },
    { category: 'alpha', id: 4 },
    { category: 'beta',  id: 5 }, 
    { category: 'gamma', 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>

<强>结果:

  • 阿尔法
  • { “类别”: “阿尔法”, “ID”:2}
  • { “类别”: “阿尔法”, “ID”:4}

  • <强>β

  • { “类别”: “测试”, “标识”:3}
  • { “类别”: “测试”, “标识”:5}

  • <强>伽马

  • { “类别”: “伽马”, “ID”:0}
  • { “类别”: “伽马”, “ID”:1}

答案 1 :(得分:0)

数组没有命名键。它有整数作为位置。所以请勿使用toArray