AngularJS toArray将对象键转换为数字

时间:2022-09-11 10:39:48

I use angular-filter in my project to sort the output objects by page the problem is when I use syntax like this:

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

<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 converts 'styl' properties ['nowoczesny','klasyczny'..] to numbers. Sorting works fine but I want to obtain names instead of numbers.

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

2 个解决方案

#1


5  

groupBy return an object, and orderBy expect array as an argument, so that's the reason you should use toArray filter.

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

toArray work like that:
Usage: object | toArray: addKey[optional]
if addKey set to true, the filter also attaches a new property $key to the value containing the original key that was used in the object we are iterating over to reference the property

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

So, you can do something like this example, or take a look on the jsbin

所以,你可以做这样的例子,或者看看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>

RESULT:

  • alpha
  • {"category":"alpha","id":2}
  • {"category":"alpha","id":4}

  • beta

  • {"category":"beta","id":3}
  • {"category":"beta","id":5}

  • gamma

  • {"category":"gamma","id":0}
  • {"category":"gamma","id":1}

#2


0  

An array has no named keys. It has integers as position. So don't use toArray.

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

#1


5  

groupBy return an object, and orderBy expect array as an argument, so that's the reason you should use toArray filter.

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

toArray work like that:
Usage: object | toArray: addKey[optional]
if addKey set to true, the filter also attaches a new property $key to the value containing the original key that was used in the object we are iterating over to reference the property

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

So, you can do something like this example, or take a look on the jsbin

所以,你可以做这样的例子,或者看看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>

RESULT:

  • alpha
  • {"category":"alpha","id":2}
  • {"category":"alpha","id":4}

  • beta

  • {"category":"beta","id":3}
  • {"category":"beta","id":5}

  • gamma

  • {"category":"gamma","id":0}
  • {"category":"gamma","id":1}

#2


0  

An array has no named keys. It has integers as position. So don't use toArray.

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