在Angular中按数字排序

时间:2015-11-22 18:54:04

标签: javascript angularjs sorting

我试图对json文件进行排序。我的逗号数字有问题。

排序后的结果:

  

0.77
  10.03
  18,79
  2,89
  24,08

可能数字会转换为字符串。

ng-repeat="cpu in cpus | orderBy:sort:reverse"

$scope.sort = 'x';
$scope.reverse = true;
$scope.order = function(sort) {
$scope.reverse = ($scope.sort === sort) ? !$scope.reverse : false;
$scope.sort = sort;

问题:知道如何解决这个问题吗?

1 个答案:

答案 0 :(得分:1)

您可以提供将字符串转换回数字的自定义值函数

<!DOCTYPE html>
<html ng-app="app">
  <head>
    <script data-require="angular.js@1.4.7" data-semver="1.4.7" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.js"></script>
    <link rel="stylesheet" href="style.css" />
    <script>
      angular
        .module('app', [])
        .controller('appCtrl', function($scope, $http) {
          $scope.cpus = [
              { name: 'cpu1', power: '0,77' },
              { name: 'cpu2', power: '10,03' },
              { name: 'cpu3', power: '18,79' },
              { name: 'cpu4', power: '2,89' },
              { name: 'cpu5', power: '24,08' }
          ];

          $scope.myValueFunction = function(cpu) {
              return Number( cpu.power.replace(',', '.') );
          };

          $scope.value = function(cpu) {
              return '(' + cpu.name + '; ' + cpu.power + ')';
          };
        });
    </script>
  </head>

  <body ng-controller="appCtrl">
    <ul ng-repeat="cpu in cpus | orderBy:myValueFunction">
      <li>{{cpu.name}} {{value(cpu)}}</li>
    </ul>
  </body>
</html>

Plunker