AngularJS地产分类 [英] AngularJS sorting by property

问题描述

我所试图做的是地产类的一些数据。下面是例子，我因子评分应该工作，但它没有。

HTML部分：

 ＆LT; D​​IV NG-应用='对myApp'＆GT;
    ＆LT; D​​IV NG控制器=控制器＆GT;
    ＆LT; UL＆GT;
        ＆LT;李NG重复=（键，值）TESTDATA |排序依据：'value.order'＆GT;
            {{value.order}}。 {{键}}  - ＆GT; {{value.name}}
        ＆LT; /李＆GT;
    ＆LT; / UL＆GT;
    ＆LT; / DIV＆GT;
＆LT; / DIV＆GT;
 

JS部分：

  VAR对myApp = angular.module（'对myApp'，[]）;myApp.controller（'控制'，['$范围'，函数（$范围）{    $ scope.testData = {
        C：{名字：CDATA，顺序为：1}，
        乙：{名字：BDATA，顺序为：2}，
        答：{名字：ADATA，顺序为：3}，
    }}]）;
 

和结果：

  

  
1. 系统 - > ADATA

  
2. B - > BDATA

  
3. Ç - > CData的

  

......那恕我直言应该是这样的：

  

  
1. Ç - > CData的

  
2. B - > BDATA

  
3. 系统 - > ADATA

  

我错过了什么（在这里准备好的jsfiddle 的实验上）？

解决方案

AngularJS排序依据筛选器只支持数组 - 没有对象。所以，你必须写一个自己的小型过滤器，由它来完成排序为您服务。

或改变你处理（如果你有这种影响）的数据格式。包含对象的数组就是将本地排序依据过滤排序。

下面是我的 orderObjectBy 作为AngularJS过滤器：

  app.filter（'orderObjectBy'，函数（）{
 返回功能（输入属性）{
    （！angular.isObject（输入））如果返回输入;    变种数组= [];
    对于（输入VAR objectKey）{
        的Array.push（输入[objectKey]）;
    }    中的Array.sort（功能（A，B）{
        一= parseInt函数（A [属性]）;
        B = parseInt函数（B [属性]）;
        返回 -  B;
    }）;
    返回数组;
 }
}）;
 

在你看来用法：

 ＆LT; D​​IV CLASS =项NG重复=中的项项| orderObjectBy：'位置'＆GT;
    // ...
＆LT; / DIV＆GT;
 

的对象在本实施例的位置属性需要，但你必须考虑到使用中的对象（含有一个整数）的任何属性，只是根据定义的灵活性。

例如JSON：

  {
    123：{名：试验B，位置：2}，
    456：{名：试验A，位置：1}
}
 

下面是一个小提琴这表明你的用法：
http://jsfiddle.net/4tkj8/1/

What I am trying to do is sort some data by property. Here is example that I tought should work but it doesn't.

HTML part:

<div ng-app='myApp'>
    <div ng-controller="controller">
    <ul>
        <li ng-repeat="(key, value) in testData | orderBy:'value.order'">
            {{value.order}}. {{key}} -> {{value.name}}
        </li>
    </ul>
    </div>
</div>

JS part:

var myApp = angular.module('myApp', []);

myApp.controller('controller', ['$scope', function ($scope) {

    $scope.testData = {
        C: {name:"CData", order: 1},
        B: {name:"BData", order: 2},
        A: {name:"AData", order: 3},
    }

}]);

And the result:

1. A -> AData
2. B -> BData
3. C -> CData

... that IMHO should look like this:

1. C -> CData
2. B -> BData
3. A -> AData

Did I miss something (here is ready JSFiddle to experiment on)?

解决方案

AngularJS' orderBy filter does just support arrays - no objects. So you have to write an own small filter, which does the sorting for you.

Or change the format of data you handle with (if you have influence on that). An array containing objects is sortable by native orderBy filter.

Here is my orderObjectBy filter for AngularJS:

app.filter('orderObjectBy', function(){
 return function(input, attribute) {
    if (!angular.isObject(input)) return input;

    var array = [];
    for(var objectKey in input) {
        array.push(input[objectKey]);
    }

    array.sort(function(a, b){
        a = parseInt(a[attribute]);
        b = parseInt(b[attribute]);
        return a - b;
    });
    return array;
 }
});

Usage in your view:

<div class="item" ng-repeat="item in items | orderObjectBy:'position'">
    //...
</div>

The object needs in this example a position attribute, but you have the flexibility to use any attribute in objects (containing an integer), just by definition in view.

Example JSON:

{
    "123": {"name": "Test B", "position": "2"},
    "456": {"name": "Test A", "position": "1"}
}

Here is a fiddle which shows you the usage: http://jsfiddle.net/4tkj8/1/

这篇关于AngularJS地产分类的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！