json 中 header 列的日期

dates as column header in json

我有一列日期为 header 请参阅我的 json 如下:

[{
  "Index": 1,
  "FirstName": "Jon",
  "LastName": "mind",
  "Job": "ME - preplaning",
  "3/8/2017": false,
  "3/7/2017": true
}, {
  "Index": 2,
  "FirstName": "KARIM",
  "LastName": "AL",
  "Job": "Mfg shift leader",
  "3/8/2017": false,
  "3/7/2017": false
}]

而且我需要在我的 uigrid 中有一个日期列的复选框,以便检查该值是真还是假, 这就是我所做的

 name: key, 
 displayName: key,
 type: 'boolean',
 cellTemplate: '<input type="checkbox" ng-model="row.entity.key">'

变量 key 包含列名,所以在我的例子中 key 会得到 3/7/2017 ,但它会抛出一个错误,因为我猜 row.entity.3/7/2017 是不可能的,任何解决方案伙计们?

这应该为你做...

var app = angular.module('app', ['ui.grid']);
app.controller('MainCtrl', ['$scope', function($scope) {
  $scope.gridOptions = {
    columnDefs: [{
        name: 'Index'
      }, {
        name: 'FirstName'
      }, {
        name: 'LastName'
      }, {
        name: 'Job'
      },
      {
        name: '3/8/2017',
        cellTemplate: '<input type="checkbox" ng-model="row.entity[col.field]">'
      }, {
        name: '3/7/2017',
        cellTemplate: '<input type="checkbox" ng-model="row.entity[col.field]">'
      }
    ],
    data: [{
      "Index": 1,
      "FirstName": "Jon",
      "LastName": "mind",
      "Job": "ME - preplaning",
      "3/8/2017": false,
      "3/7/2017": true
    }, {
      "Index": 2,
      "FirstName": "KARIM",
      "LastName": "AL",
      "Job": "Mfg shift leader",
      "3/8/2017": false,
      "3/7/2017": false
    }]
  };
}]);
div[ui-grid] {
  height: 110px;
}
<script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.1/angular.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/angular-ui-grid/4.0.2/ui-grid.min.js"></script>
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/angular-ui-grid/4.0.2/ui-grid.min.css" />
<div ng-app="app" ng-controller="MainCtrl">
  <div ui-grid="gridOptions"></div>
  <div>{{gridOptions.data}}</div>
</div>

如果您有任何其他问题,请告诉我。