web-dev-qa-db-ja.com

Angular-uiのツールチップがng-gridで正しく表示されない

Ng-gridにツールチップを表示するための解決策をしばらく探していましたが、うまくいきませんでした。 ng-gridでcellTemplateを使用してセルをカスタマイズし、ツールチップを含めると、さまざまな問題が発生しました。ツールチップが表示されないか、プランカーに表示されるように奇妙な動作をします。 http://plnkr.co/edit/MFhwgOvSUFKcyJPse5wf 。

私は何かを逃したことがありますか？ ng-gridでツールチップをうまく表示するためのソリューションを持っている人はいますか？

宜しくお願いします。

angularjsangular-ui-bootstrapng-grid
8
jstensen

私がコメントしたように、これはng-gridセル内の 既知の問題 です。列定義のcellClassを次のように設定することでこれを修正しました。

cellClass: 'cellToolTip'

そしてcss：

.cellToolTip {
    overflow: visible;
}

ここにプランカーがあります ツールチップを表示します。ただし、ツールチップは正確に正しく配置されていません。 :)

[〜＃〜] edit [〜＃〜]：これを.tooltipスタイルに追加すると、配置の問題が修正されましたが、私はそうではありませんプランカーで私がこれをしなければならなかった理由は確かです。私自身のコードでは、これは必要ありませんでした：

.tooltip {
  top: 0 !important;
}

これが 新しいプランカー 動作しています。

14
Davin Tryon

あなたが使用することができます

tooltip-append-to-body="true"

ここに記載されているように（ツールチップまでスクロールダウン）： http://angular-ui.github.io/bootstrap/

プランカーは次のとおりです。 http://plnkr.co/edit/nHN2p8qMjT7ZTwpXgJoO?p=preview

37
lmyers