Question

這是問題 我有表中NG網這樣的：

var templateImage = '<div class="ngCellText" ng-class="col.colIndex()"><img src="images/{{row.getProperty(\'faseXD[0].fase\')}}.png"></div>'; 
var templateText = '<div class="ngCellText" ng-class="col.colIndex()"><p id="gridField" ng-cell-text>{{row.getProperty(col.field)}}</p></div>'; 
$scope.gridOptions= { 
    data:'request', 
    multiSelect:false, 
    headerCellTemplate:'<div class="ngHeaderSortColumn {{col.headerClass}}" ng-style="{\'cursor\': col.cursor}" ng-class="{ \'ngSorted\': !noSortVisible }"><div ng-click="col.sort($event)" ng-class="\'colt\' + col.index" class="ngHeaderText">{{col.displayName}}</div><div class="ngSortButtonDown" ng-show="col.showSortButtonDown()"></div><div class="ngSortButtonUp" ng-show="col.showSortButtonUp()"></div><div class="ngSortPriority">{{col.sortPriority}}</div><div ng-class="{ ngPinnedIcon: col.pinned, ngUnPinnedIcon: !col.pinned }" ng-click="togglePin(col)" ng-show="col.pinnable"></div></div><div ng-show="col.resizable" class="ngHeaderGrip" ng-click="col.gripClick($event)" ng-mousedown="col.gripOnMouseDown($event)"></div>', 
    columnDefs: [{ field: 'product', displayName: 'product',cellTemplate: templateTesto}, 
     {field:'ticket', visible:false}, 
     { field:'subject', displayName:'subject', cellTemplate: templateTesto}, 
     { field: 'date', displayName: 'date',cellTemplate: templateTesto} , 
     { field: 'faseXD', displayName: 'faseXD',cellTemplate: templateImmgaini,cellClass:'cellImage' }, 
     { displayName: 'Report', cellTemplate:'<div ><button ng-diasbled="pdfenabled" ng-click="reportpdf(row.getProperty(\'ticket\'),row.getProperty(\'faseXD[0].fase\'))"><i class="glyphicon glyphicon-file"></i></button></div>', cellClass:'gridCell' } 
     ] 
} 

我需要做templateImage從其他列不同，準確地說，我需要改變的寬度。我在網絡上發現了一些樣本來改變顏色或其他小東西，但不是細胞的尺寸，有可能嗎？

Answer 1

您可以簡單地在columnDefs中設置寬度。

var templateImage = '<div class="ngCellText" ng-class="col.colIndex()"><img src="images/{{row.getProperty(\'faseXD[0].fase\')}}.png"></div>'; 
    var templateText = '<div class="ngCellText" ng-class="col.colIndex()"><p id="gridField" ng-cell-text>{{row.getProperty(col.field)}}</p></div>'; 
    $scope.gridOptions = { 
    data: 'myData', 
    headerCellTemplate: '<div class="ngHeaderSortColumn {{col.headerClass}}" ng-style="{\'cursor\': col.cursor}" ng-class="{ \'ngSorted\': !noSortVisible }"><div ng-click="col.sort($event)" ng-class="\'colt\' + col.index" class="ngHeaderText">{{col.displayName}}</div><div class="ngSortButtonDown" ng-show="col.showSortButtonDown()"></div><div class="ngSortButtonUp" ng-show="col.showSortButtonUp()"></div><div class="ngSortPriority">{{col.sortPriority}}</div><div ng-class="{ ngPinnedIcon: col.pinned, ngUnPinnedIcon: !col.pinned }" ng-click="togglePin(col)" ng-show="col.pinnable"></div></div><div ng-show="col.resizable" class="ngHeaderGrip" ng-click="col.gripClick($event)" ng-mousedown="col.gripOnMouseDown($event)"></div>', 
    columnDefs: [{ 
     field: 'name', 
     width: '50px', 
     displayName: 'product', 
     cellTemplate: templateImage 
    }, { 
     field: 'age', 
     visible: true 
    }] 
    }; 

Example