javascript - number - order by angular 4

Orderby no funciona con la sintaxis dict en ng-repeat

Question

Estoy tratando de usar ng-repeat con una sintaxis de estilo de diccionario y aplicar una orden al valor de la clave.

(key, value) in something | orderBy:''key''

Parece que OrderBy no está funcionando como se esperaba

Ejemplo aquí http://jsfiddle.net/mhXuW/

Answer 1

Aquí hay un buen trabajo ( angular-toArrayFilter ):

.filter(''toArray'', function () {
  return function (obj, addKey) {
    if ( addKey === false ) {
      return Object.keys(obj).map(function(key) {
        return obj[key];
      });
    } else {
      return Object.keys(obj).map(function (key) {
        if(typeof obj[key] == ''object'') return Object.defineProperty(obj[key], ''$key'', {     enumerable: false, value: key});
      });
    }
  };
});

Answer 2

Como dice akonsu, la función ha sido solicitada https://github.com/angular/angular.js/issues/1286 . Sin embargo, todavía no puedo hacer que funcione con la versión beta más reciente (1.3.0).

Hay una buena solución enterrada en los comentarios (tenga en cuenta que esto requiere underscore , y deberá reemplazar las referencias a ''clave'' por ''valor. $ Clave'' en el ejemplo anterior):

[Agregar un filtro]:

app.filter(''toArray'', function() { return function(obj) {
    if (!(obj instanceof Object)) return obj;
    return _.map(obj, function(val, key) {
        return Object.defineProperty(val, ''$key'', {__proto__: null, value: key});
    });
}});

Ejemplo de marcado:

<div ng-repeat="val in object | toArray | orderBy:''priority'' | filter:fieldSearch">
  {{val.$key}} : {{val}} 
</div>

Desventajas potenciales:

• Object.defineProperty no funcionará así en IE8 (si no te importa hacer que $ clave sea enumerable, entonces este es un cambio sencillo).
• Si los valores de sus propiedades no son objetos, entonces no puede establecer la propiedad $ clave y esto falla.
• No está integrado directamente en orderBy o ngRepeat, por lo que la sintaxis es diferente.

Answer 3

Creé un filtro personalizado para hacer esto posible para una lista de selección:

.filter(''toDictionaryArray'', function () {
    return function (obj) {
        if (!(obj instanceof Object)) return obj;

        var arr = [];
        for (var key in obj) {
            arr.push({ key: key, value: obj[key] });
        }
        return arr;
    }
})

la lista de selección ng-options dice lo siguiente:

<select ng-options="kv.key as kv.value for kv in p.options | toDictionaryArray | orderBy:''value''"></select>

Answer 4

En lugar de utilizar el filtro orderby que solo admite matrices y no objetos. Puedes escribir tu propio filtro así Tomé el código de Justin Klemm http://justinklemm.com/angularjs-filter-ordering-objects-ngrepeat/ y agregué soporte para especificar múltiples campos de ordenamiento. El siguiente ejemplo de filtro es para filtrar en función de las propiedades en los valores, pero también puede cambiarlo fácilmente para filtrar según la clave.

app.filter(''orderObjectBy'', function()
{
    return function(items, fields, reverse)
    {
        var filtered = [];
        angular.forEach(items, function(item)
        {
            filtered.push(item);
        });

        filtered.sort(function (a, b)
        {
            var result = 0;

            for (var i = 0; i < fields.length; ++i)
            {
                if (a[fields[i]] > b[fields[i]])
                {
                    result = 1;
                    break;
                }
                else if (a[fields[i]] < b[fields[i]])
                {
                    result = -1;
                    break;
                }
            }

            return result;
        });

        if (reverse)
        {
            filtered.reverse();
        }

        return filtered;
    };
});

Luego, dentro de su página web html5, úselo como tal, donde las estadísticas son un mapa / diccionario con pares clave de valores.

<div class="row" ng-repeat="stat in statistics | orderObjectBy: ''NumTimesPartnered'', ''NumTimesOpponent'']:true">
    <div class="col col-33">{{stat.Name}}</div>
    <div class="col"><center>{{stat.NumTimesPartnered}}</center></div>
    <div class="col"><center>{{stat.NumTimesOpponent}}</center></div>
</div>

Answer 5

Los parámetros para orderBy deben coincidir con los nombres de propiedad en una matriz de objetos.

Sus datos deben verse algo como esto:

$scope.list2 = [ { id:"2013-01-08T00:00:00", name:''Joe''},
                 { id:"2013-01-09T00:00:00", name:''Sue''}];

Entonces un filtro como este funcionará:

<div ng-repeat="item in list2 | orderBy:''id'':true">

Fiddle .

Tenga en cuenta que orderBy funciona en toda la matriz ( something en su código de muestra anterior) y devuelve una matriz ordenada. orderBy no sabe nada sobre la key y el value .

Answer 6

esto no está implementado. por favor mira aquí:

https://github.com/angular/angular.js/issues/1286

EDITAR (27 de agosto de 2013): este problema parece estar resuelto ahora.