angularjs – ng-grid headerRowTemplate – 有没有人用过这个?

我的团队想要使用ng-grid的这个功能.但是它似乎没有在任何地方记录.我们想要做的是在ng-grid的标题区域的最后一列放置一个“加号”图标.

有没有人找到一个很好的方法来做到这一点?

只需修改网格中最后一列的headerCellTemplate(参见 https://github.com/angular-ui/ng-grid/wiki/Templating).

这是一个例子(注意< img src =“PLUS-ICON.png”/>在第二行):

var myHeaderCellTemplate = '<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}} <img src="PLUS-ICON.png" /></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>';
$scope.gridOptions = {
    data: self.myData,columnDefs: [
        { field: 'firstField',displayName: 'First Column' },{ field: 'secondField',displayName: 'Second Column' },...
        { field: 'lastField',displayName: 'Last Column',headerCellTemplate: myHeaderCellTemplate }
    ]
};

相关文章

ANGULAR.JS:NG-SELECTANDNG-OPTIONSPS:其实看英文文档比看中...
AngularJS中使用Chart.js制折线图与饼图实例  Chart.js 是...
IE浏览器兼容性后续前言 继续尝试解决IE浏览器兼容性问题,...
Angular实现下拉菜单多选写这篇文章时,引用文章地址如下:h...
在AngularJS应用中集成科大讯飞语音输入功能前言 根据项目...
Angular数据更新不及时问题探讨前言 在修复控制角标正确变...