我正在使用colDef的cellTooltip
属性,但似乎不起作用。
$scope.gridOptions.columnDefs = [{ displayName: 'Test', field: '_test',
cellTooltip: function (row, col) { return row.entity._Number },
cellTemplate: '<div class="ui-grid-cell-contents" title="{{row.entity._Number}}"></div>'},
];
字符串
如果你能帮忙的话,我会很感激的。
5条答案
按热度按时间wqsoz72f1#
只需在列定义中添加
headerTooltip: 'Custom header string'
,就可以将工具提示添加到列标题中。https://github.com/angular-ui/ui-grid/issues/3118
w8ntj3qf2#
对于ui-grid中的标题工具提示,有
headerCellTemplate
属性可用。这对我很有效。字符串
kx5bkwkv3#
Bhavjot的答案确实包含了一个很好的有Angular 的工具提示,但在每个单元格上,而不是你要求的标题。我看到你的模板工程,但如果你正在寻找一些更有Angular 的东西,我把这个模板放在一起:
字符串
此外,这里是一个柱塞,你可以看到两种类型的工具提示一起工作。https://plnkr.co/edit/cCIKBWx0KfbIPUiheZP6?p=preview请将其中一个答案标记为您问题的答案。
blpfk2vs4#
默认情况下,网格的单元格被设置为隐藏任何溢出,所以如果你只是在其中弹出一个工具提示,它不会显示。你可以通过添加一些自定义溢出CSS到你的cellTemplate来解决这个问题,或者如果你使用的是UI Bootstrap,你可以用你的工具提示添加tooltip-append-to-body=“true”到元素中,工具提示将被附加到主体中,并完全定位在需要的位置。
对于Overflow CSS,在单元格模板中添加类“grid-tooltip”,并将CSS类定义为:
字符串
参考:http://brianhann.com/6-ways-to-take-control-of-how-your-ui-grid-data-is-displayed/
带有Overflow CSS和UI Bootstrap的Plunker示例(tooltip-append-to-body=“true”):http://embed.plnkr.co/v7a1W5mFHHaG894IDLTK/的
kulphzqa5#
而不是cellTemplate或headerCellTemplate。您可以简单地将columnDefs中的数据绑定为
字符串