AngularJS UI网格排序不适用于嵌套对象

我正在使用AngularJS UI网格以网格格式显示我的数据。但是排序不适用于嵌套对象列。对于其他列（对于非嵌套对象），排序工作正常。以下是代码片段。AngularJS UI网格排序不适用于嵌套对象

<!DOCTYPE html> 
    <html xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
    <title> 
    Angularjs UI-Grid Sorting Example 
    </title> 
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.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"> 
    <script type="text/javascript"> 
    var app = angular.module("uigridApp", ["ui.grid"]); 
    app.controller("uigridCtrl", function ($scope) { 

    var template1 ='<div ><span >{{row.entity.name}}</span></div>'; 
    var template2 ='<div ><span >{{row.entity.age}}</span></div>'; 
    var template3 ='<div ><span >{{row.entity.address.house}}</span></div>'; 

    $scope.gridOptions = { 
    enableSorting: true, 
    columnDefs: [ 
      { field: 'name', cellTemplate: template1}, 
      { field: 'age', cellTemplate: template2}, 
      { field: 'house', cellTemplate: template3} 
     ], 
    onRegisterApi: function (gridApi) { 
     $scope.grid1Api = gridApi; 
     } 
    }; 
    $scope.users = [ 
      { name: "Anup K", age: 10, 'address': {'house': '34','street': 'MG Road','city': 'Pune'} }, 
      { name: "Suresh Kumar", age: 30, 'address': {'house': '12','street': 'Brigade Road','city': 'Bangalore'} }, 
      { name: "Rohini Shah", age: 29, 'address': {'house': '18','street': 'AB Road','city': 'Mumbai'} }, 
      { name: "Mohan Alavala", age: 25, 'address': {'house': '50','street': 'Gulmohar Road','city': 'Delhi'} }, 
      { name: "Atul M", age: 27, 'address': {'house': '3','street': 'Charminar Road','city': 'Hydrabad'} } 
     ]; 
    $scope.gridOptions.data = $scope.users; 
    }); 
    </script> 
    <style type="text/css"> 
    .myGrid { 
    width: 500px; 
    height: 230px; 
    } 
    </style> 
    </head> 
    <body ng-app="uigridApp"> 
    <h2>AngularJS UI Grid Sorting Example</h2> 
    <div ng-controller="uigridCtrl"> 
    <div ui-grid="gridOptions" class="myGrid"></div> 
    </div> 
    </body> 
    </html>

Screenshot

有三名的姓名，年龄和房屋。排序只适用于名称和年龄栏，而不适用于房屋（因为它是嵌套用户 - >地址 - >房屋）

我该如何处理这种情况？在此先感谢....

来源

2017-06-20 Swapnil

在columnDefs指定field: 'address.house'。它应该做的伎俩。您的最终columnDefs将如下所示：

columnDefs: [ 
    { field: 'name', cellTemplate: template1}, 
    { field: 'age', cellTemplate: template2}, 
    { field: 'address.house', cellTemplate: template3} 
]

来源

2017-06-20 14:56:34 xReeQz

感谢您的回复。它正在工作如果我有JSON格式的数据。但如何处理相同的情况如果数据是Javascript对象＆它嵌套了对象数组，并且其中一列正在呈现嵌套对象变量。例如我有模板，如 var template3 ='

'，应将什么值分配给columnDef中的字段。我试过地址[index] .house，但它不工作。注意：我不想将JavaScript对象转换为JSON。 – Swapnil

假设你想通过嵌套数组的第一个地址对'House'列进行排序，你可以设置'field：'address [0] .house''。但是，如果您需要显示所有地址并按'house'整理整个数据集，那么实现这一目标的唯一方法就是平整您的数据集。 – xReeQz

AngularJS UI网格排序不适用于嵌套对象

回答

相关问题