-1
A
答えて
1
はい、あなたはhtmlファイルをインポートするか、私がやったようなJSで記述することができ、このに、cellTemplateを使用することができます。 http://ui-grid.info/docs/#/tutorial/317_custom_templates
var app = angular.module('app', ['ui.grid', 'ui.grid.edit']);
app.controller('MainCtrl', ['$scope', '$http', function ($scope, $http) {
$scope.myData = [{
"firstName": "Cox",
"lastName": "Carney",
"company": "Enormo"
}, {
"firstName": "Lorraine",
"lastName": "Wise",
"company": "Comveyer"
}, {
"firstName": "Nancy",
"lastName": "Waters",
"company": "Fuelton"
}];
var template = '';
template += '<div class="ui-grid-cell-contents">';
template += ' {{row.entity.firstName}} ';
template += ' {{row.entity.lastName}}';
template += ' </div>';
var columnDefs = [
{field: 'firstName', displayName: 'Name', cellTemplate: template},
{field: 'company', displayName: 'Company'}
];
$scope.gridOptions = {
data: 'myData',
columnDefs: columnDefs
};
}]);
<!doctype html>
<html ng-app="app">
<head>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.13/angular.js"></script>
<script src="//cdn.rawgit.com/angular-ui/bower-ui-grid/v3.0.6/ui-grid.min.js"></script>
<link rel="stylesheet" href="//cdn.rawgit.com/angular-ui/bower-ui-grid/v3.0.6/ui-grid.min.css" type="text/css" />
<link rel="stylesheet" href="main.css" type="text/css">
</head>
<body>
<div ng-controller="MainCtrl">
<div id="grid1" ui-grid="gridOptions" ui-grid-edit class="grid"></div>
</div>
<script src="app.js"></script>
</body>
</html>