javascript - 如何对 UI 网格中的列进行排序？

Question

我有一个 JSON，其形式类似于

{
 x:1,
 y:2
}

这意味着当我将其粘贴到用户界面网格上时，x 列是第一个，y 列是第二个。但是，我想要相反的情况:y 然后 x。

如何告诉 UI-grid 在 x 之前显示 y？

Answer 1

通过使用columnDefs。

在 html 中定义网格，如下所示:

<div id="grid1" ui-grid="gridOptions" class="grid"></div>

您的应用程序代码如下所示:

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

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

    $scope.myData = [{
      "x": "1",
      "y": "2",

    }, {
      "x": "3",
      "y": "4",

    }];

    $scope.gridOptions = {
      data: 'myData'
    };

    $scope.gridOptions.columnDefs = [{
        name: 'y'
      }, {
        name: 'x'
      },
    ];
  }
]);

请注意 columnDefs 如何使用 y 作为第一列，使用 x 作为第二列。

这是一个Plunker