工具提示在`angular-ui-grid`中无法正常工作

问题描述：

我在网格中使用angular-ui-gridv3.0.0-rc.22-e8fe073和bootstrap工具提示ui.bootstrap。工具提示在`angular-ui-grid`中无法正常工作

请在下面找到如下提示模板：

var templateWithTooltip = '<div class="ui-grid-cell-contents"><a tooltip=\'{{COL_FIELD CUSTOM_FILTERS}}\' tooltip-append-to-body="true" tooltip-placement="right" style="text-decoration:none;top:0!important; white-space:pre;max-width:none;">{{ COL_FIELD CUSTOM_FILTERS }}</a></div>';

而且在电网以此为cellTemplate: templateWithTooltip。并在CSS中：

.tooltip-inner{ 
     word-wrap: break-word; 
    }

该工具提示适用于除最后一列以外的所有列。请从下面的分辨率1680×1050拍摄截图：

我试着用`提示贴装=“自动权”，但是这使得位置，即使最坏的其他列也是如此。

试图与这个问题，以及：

cellClass: 'cellToolTip'

和

.cellToolTip { 
    overflow: visible; 
}

更新：

是否可以调用一个函数来的位置，名称分配给tooltip-placement属性？就像这样：

$scope.fnGetTooltipPosition = function (context, source) {   
      var position = $(source).position(); 
      /*if (position.left > 1600) { 
       return "left"; 
      } 
      if (position.left < 1200) { 
       return "left"; 
      } 
      if (position.top < 1050){ 
       return "left"; 
      }*/ 
      return "left"; 
     } 

var templateWithTooltip = '<div class="ui-grid-cell-contents"><a tooltip=\'{{COL_FIELD CUSTOM_FILTERS}}\' tooltip-append-to-body="true" tooltip-placement={{fnGetTooltipPosition()}} style="text-decoration:none;white-space:pre;max-width:none;">{{ COL_FIELD CUSTOM_FILTERS }}</a></div>';

我试图与上述但提示总是在顶部。如果可以这样做，那么我认为我们可以根据分辨率获得正确的工具提示位置。

更新2

是否可以调用一个函数的每个细胞得到它的位置，并分别适用工具提示的位置？如何为网格中的每个单元格调用函数？

如果工具提示内容不符合屏幕分辨率，是否可以在最后一列的底部或左侧位置显示工具提示？如何正确显示网格最后一列的工具提示？

提供从明年开始的时间复制您的问题pluncker链接。它可以提高您快速正确获取解决方案的机会。 – SaiGiridhar

答

是的，可以调用一个函数并决定放置工具提示的位置。

CellTemplate：

'<div class="ui-grid-cell-contents"><a tooltip=\'{{COL_FIELD CUSTOM_FILTERS}}\' tooltip-append-to-body="true" tooltip-placement={{grid.appScope.fnGetTooltipPosition(row)}} style="text-decoration:none;white-space:pre;max-width:none;">{{ COL_FIELD CUSTOM_FILTERS }}</a></div>'

然后在控制器中定义一个函数来得到这个职位。

功能：

$scope.fnGetTooltipPosition= function(row) { 
    var index = $scope.gridOptions.data.indexOf(row.entity); 
    //Check here whether index is equal to the (arrayLength-1), and return position 
};

工具提示在`angular-ui-grid`中无法正常工作

相关推荐