Question

我正在尝试在ng-grid中使用多行列标题。我正在使用AngularJS 1.2.11，ng-grid 2.0.8和JQuery 2.1.0。这是我最近的尝试。标题仍显示为“某些数据”。

var app = angular.module('myApp', ['ngGrid']);

app.controller('myCtrl', function($scope, $sce) {

var head4 = 'Some<br>Data'
var trustHead4 = $sce.trustAsHtml(head4);

var colDefs = [{field: 'name', displayName: 'Name'},
               {field: 'age', displayName: 'Age in Years'},
               {field: 'datums', displayName: trustHead4, width:100},
              ];

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" ng-bind-html="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>' +
                           '<div ng-show="col.resizable" class="ngHeaderGrip" ng-click="col.gripClick($event)" ng-mousedown="col.gripOnMouseDown($event)"></div>';

$scope.myData = [{name: "Thomas", age: 27, datums: 'adfkjrg'},
                 {name: "Frances", age: 43, datums: 'adfkjrg'},
                 {name: "Leila", age: 27, datums: 'adfkjrg'},
                 {name: "Cute", age: 29, datums: 'adfkjrg'},
                 {name: "John", age: 34, datums: 'adfkjrg'}
                ];

$scope.myGrid = {
    data: 'myData',
    showGroupPanel: false,
    columnDefs: colDefs,
    showFooter: false,
    headerCellTemplate: myHeaderCellTemplate
};
});

Answer 1

我会说headerCellTemplate属于columnDefs选项。相反，您将其定义为网格选项。

ng-grid - 创建多行列标题

1 个答案: