ng-grid headerRowTemplate - 누구든지 이것을 사용 했습니까?

Question

우리 팀은 ng-grid의이 기능을 사용하고 싶어합니다. 그러나 어디에도 문서화되어 있지 않은 것 같습니다. 우리가하고자하는 것은 ng 그리드의 헤더 영역의 마지막 열에 "더하기"아이콘을 넣는 것입니다.

누구든지 좋은 방법을 찾았습니까?

Answer 1

그리드의 마지막 열에 대해 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 } 
    ] 
};