ag-Grid创建模板到不工作的列 - AngularJS

时间:2016-06-23 10:10:53

标签: angularjs ag-grid

我使用ag-Grid填充数据表。我想创建一个模板列。这是我的代码。但是,由于网格表没有显示在小提琴中,我无法提供小提琴。

JS:

agGrid.initialiseAgGridWithAngular1(angular);

var app = angular.module('myApp', ['agGrid']);
app.controller('myController', function($scope) {
 var columnDefs = [{
  headerName: "<input type=checkbox>",
  field: "Select",
  width: 120,
  cellRenderer: function(params) {
  var htmlElement = document.createElement("input");
  htmlElement.type = 'checkbox';
  return htmlElement;
 }
}, {
 headerName: "Ref No",
 field: "rn",
 width: 120,
 template: '<a href="#/updateInspection" ng-bind="myDummyData.rn></a>'
}, {
 headerName: "Postal Code",
 field: "pc",
 width: 120
}, {
 headerName: "Zone Name",
 field: "zn",
 width: 120
}];

$scope.myDummyData = [{
 "rn": "HIP/12/TM-1",
 "pc": "400001",
 "zn": "Zone - 1"
}, {
 "rn": "HIP/12/TM-1",
 "pc": "400001",
 "zn": "Zone - 1"
}];

$scope.gridOptions = {
 columnDefs: columnDefs,
 rowData: $scope.myDummyData,
 enableFilter: true,
 enableColResize: true,
 enableSorting: true,
 rowHeight: 36,
 headerHeight: 36
};

 document.addEventListener('DOMContentLoaded', function() {
  var gridDiv = document.querySelector('#myGrid');
  new agGrid.Grid(gridDiv, $scope.gridOptions);
  $scope.gridOptions.api.setRowData($scope.myDummyData);
 });
});

HTML:

<div ng-controller="myController">
 <div id="myGrid" class="ag-fresh" ag-grid="gridOptions"></div>
</div>

显示包含值的所有行,但不显示包含模板的第一列。它是否与ng-bind

有关

我以this link为例。除了JSON数据,我已经创建了自己的数据。

我该如何解决这个问题?

1 个答案:

答案 0 :(得分:0)

启用Angular Compile 通过将网格选项属性angularCompileRows设置为true来打开角度编译。