如何在角度ui网格单元格中添加图像.
var app = angular.module('app',['ngAnimate','ngTouch','ui.grid']);
app.controller('MainCtrl',['$scope','$http',function ($scope,$http) {
$scope.gridOptions = {
enableSorting: true,columnDefs: [
{ field: 'name' },{ field: 'company' },{ field: 'image'}
],data:[
{name:"Name1",company:"Company1",image:"http://cdn.flaticon.com/png/256/70689.png"},{name:"Name2",company:"Company2",]
};
}]);
解决方法
您可以使用自定义单元格模板在单元格中呈现图像.
var app = angular.module('app','ui.grid']);
app.controller('MainCtrl',$http) {
$scope.gridOptions = {
enableSorting: true,rowHeight:100,columnDefs: [
{ field: 'name' },{ field: 'image',cellTemplate:"<img width=\"50px\" ng-src=\"{{grid.getCellValue(row,col)}}\" lazy-src>"}
],data:[
{name:"Name1",{name:"Name3",company:"Company3",image:"http://cdn.flaticon.com/png/256/70689.png"}
]
};
}]);
这是一个有效的plnkr.
