Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/405.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript ng网格中底层数据的排序_Javascript_Angularjs_Sorting_Ng Grid - Fatal编程技术网

Javascript ng网格中底层数据的排序

Javascript ng网格中底层数据的排序,javascript,angularjs,sorting,ng-grid,Javascript,Angularjs,Sorting,Ng Grid,我希望在ng网格单元格中显示格式化的值,但对未显示的相关数值进行排序 var myData1 = [{ name: "Moroni", age: 50, ageWord: "Fifty" } 从上面的示例中,我将显示ageWord列,但希望在age列上排序 用于对ng grid进行排序的指令表明我可以提供一个自定义函数来对基础数据进行排序: sortFn 设置列的排序函数。当您有格式不正常的数据,或者希望对基础数据类型进行排序时,此功能非常有用。查看MDN排序文档以获取示例 单击列排

我希望在ng网格单元格中显示格式化的值,但对未显示的相关数值进行排序

var myData1 = [{
 name: "Moroni",
  age: 50,
  ageWord: "Fifty"
}
从上面的示例中,我将显示ageWord列,但希望在age列上排序

用于对ng grid进行排序的指令表明我可以提供一个自定义函数来对基础数据进行排序:

sortFn

设置列的排序函数。当您有格式不正常的数据,或者希望对基础数据类型进行排序时,此功能非常有用。查看MDN排序文档以获取示例

单击列排序时,custom sort函数接收显示值,但我希望按年龄排序。如果我在sort函数中有可用的行,我可以在同级单元格上进行排序,如下所示:

sortFn: function(a, b) {
    var ageA = a.getProperty('age');
    var ageB = b.getProperty('age');
    return ageA-ageB;
  }
 $scope.gridOptions = { 
  data: 'gridData',
    columnDefs: [
      {field: 'name', displayName: 'Name'}, 
      {field:'ageWord', displayName: 'Age'}
    ],
    sortInfo: {
      fields: ['age'],
      directions: ['asc']
    }
};

对“ageWord”列排序时如何按“年龄”排序有何建议?示例可用

您需要将列定义为对象,并定义单元格模板。然后在sortFn()中使用age属性:

//main.js
var-app=angular.module('myApp',['ngGrid']);
应用程序控制器('MyCtrl',函数($scope){
//请注意,年龄现在是要与cellTemplate一起使用的对象
var myData1=[{name:“Moroni”,age:{age:50,ageWord:“五十”},
{姓名:“Tiancum”,年龄:{年龄:43岁,年龄词:“43”},
{姓名:“米尔德里德”,年龄:{年龄:70,年龄词:“70”},
{姓名:“雅各”,年龄:{年龄:27岁,年龄字:“二十七岁”}};
$scope.gridOptions={
数据:“gridData”,
columnDefs:[
{字段:'name',显示名称:'name'},
{字段:'age',
显示名称:'Age',
cellTemplate:“{{COL_FIELD.ageWord}}”,
sortFn:函数(a,b){
//比较对象的年龄属性
如果(a.年龄b.年龄){
返回1;
}
否则{
返回0;
}
}
}]
};
$scope.gridData=myData1;
});
根据文档,cellTemplate默认为:

<div class="ngCellText" ng-class="col.colIndex()"><span ng-cell-text>{{COL_FIELD CUSTOM_FILTERS}}</span></div>
{{COL_字段自定义_过滤器}

因此,您只需使用{{COL_FIELD.age}和您可能(或可能没有)的任何自定义筛选器。

您可以在
网格选项中使用
sortInfo
,如下所示:

sortFn: function(a, b) {
    var ageA = a.getProperty('age');
    var ageB = b.getProperty('age');
    return ageA-ageB;
  }
 $scope.gridOptions = { 
  data: 'gridData',
    columnDefs: [
      {field: 'name', displayName: 'Name'}, 
      {field:'ageWord', displayName: 'Age'}
    ],
    sortInfo: {
      fields: ['age'],
      directions: ['asc']
    }
};

您可以使用
字段:'age',cellFilter:'toWord'
并编写一个过滤器toWord(num)?与此类似:sortInfo在第一次查看时提供“初始”排序。“定义sortInfo对象以指定默认排序状态。”它不会影响列排序单击事件。工作出色,改变了我以前准备/显示数据的方式。谢谢