分选角ui-grid货币列。

时间:2022-04-26 19:45:13

I'm trying to sort a grid on a column where the values are in dollars (with $ and , included) but the sorting doesn't work correctly on that - is there a way to get the sorting to work on this, or if necessary, set the values to numbers and then display as money?

我想一个网格列进行排序的值以美元(包括美元,)但排序不正确工作,是否有办法让排序工作,或者如果有必要,将值设置为数字,然后显示钱吗?

i have:

我有:

$scope.data = [
    { 'value': '$1,000,000' },
    { 'value': '$100,000' },
....
    { 'value': '$1,000' }
];
$scope.gridOptions = {
enableSorting: true,
data: $scope.data,
columnDefs: [
...
    { name: 'Value', field: 'value', width: 110 }
]

1 个解决方案

#1


0  

I dont see your exact Html and other JS code , So I tried myself Click on a column header to sort by that column. If you missed anything in your code please include it.I posted my working example.,

我没有看到确切的Html和其他JS代码,所以我试着点击一个列标题来排序。如果您遗漏了任何代码,请包括它。我发布了我的工作示例。

Html code ,

Html代码,

<!doctype html>
<html ng-app="app">
  <head>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.js"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular-touch.js"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular-animate.js"></script>
    <script src="http://ui-grid.info/release/ui-grid.js"></script>
    <link rel="stylesheet" href="http://ui-grid.info/release/ui-grid.css" type="text/css">
    <link rel="stylesheet" href="main.css" type="text/css">
  </head>
  <body>

<div ng-controller="MainCtrl">
  <br>
  <br>
  <div id="grid1" ui-grid="gridOptions1" class="grid"></div>
  <br>
</div>
    <script src="app.js"></script>
  </body>
</html>

JS Code

JS代码

var app = angular.module('app', ['ngAnimate', 'ngTouch', 'ui.grid']);

app.controller('MainCtrl', ['$scope', '$http', 'uiGridConstants', function ($scope, $http, uiGridConstants) {

  $scope.data = [
    { 'value': '$1,000,000' },
    { 'value': '$100,000' },
    { 'value': '$1,000' }
];
  $scope.gridOptions1 = {
    enableSorting: true,
    columnDefs: [
      { field: 'value',
        name:'value'},
    ],
  };
      $scope.gridOptions1.data = $scope.data;
}]);

#1


0  

I dont see your exact Html and other JS code , So I tried myself Click on a column header to sort by that column. If you missed anything in your code please include it.I posted my working example.,

我没有看到确切的Html和其他JS代码,所以我试着点击一个列标题来排序。如果您遗漏了任何代码,请包括它。我发布了我的工作示例。

Html code ,

Html代码,

<!doctype html>
<html ng-app="app">
  <head>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.js"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular-touch.js"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular-animate.js"></script>
    <script src="http://ui-grid.info/release/ui-grid.js"></script>
    <link rel="stylesheet" href="http://ui-grid.info/release/ui-grid.css" type="text/css">
    <link rel="stylesheet" href="main.css" type="text/css">
  </head>
  <body>

<div ng-controller="MainCtrl">
  <br>
  <br>
  <div id="grid1" ui-grid="gridOptions1" class="grid"></div>
  <br>
</div>
    <script src="app.js"></script>
  </body>
</html>

JS Code

JS代码

var app = angular.module('app', ['ngAnimate', 'ngTouch', 'ui.grid']);

app.controller('MainCtrl', ['$scope', '$http', 'uiGridConstants', function ($scope, $http, uiGridConstants) {

  $scope.data = [
    { 'value': '$1,000,000' },
    { 'value': '$100,000' },
    { 'value': '$1,000' }
];
  $scope.gridOptions1 = {
    enableSorting: true,
    columnDefs: [
      { field: 'value',
        name:'value'},
    ],
  };
      $scope.gridOptions1.data = $scope.data;
}]);