工具提示在`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

是否可以調用一個函數的每個細胞得到它的位置，並分別適用工具提示的位置？如何爲網格中的每個單元格調用函數？

如果工具提示內容不符合屏幕分辨率，是否可以在最後一列的底部或左側位置顯示工具提示？如何正確顯示網格最後一列的工具提示？

來源

2015-10-13 Valay

提供從明年開始的時間複製您的問題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 
};

來源

2015-10-14 14:43:45 SaiGiridhar

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

回答

相關問題