ui-grid headerCellTemplateでPopoverが機能しない

Question

headerCellTemplateにpopoverを追加しましたが、うまく機能していないようです。

headerCellTemplate: '<div popover="Info" popover-title="Title" popover-trigger="mouseenter" popover-placement="top" popover-append-to-header="true" style="padding-top: 5px;line-height: 1.2;vertical-align: baseline;">' + Address + '</div>' 

上記のコードでは、アドレスはグリッドで表示されていますが、ポップオーバーは表示されません。スタイルもうまくいきます。ポップオーバーは機能しません。 popover-append-to-header = "true"の代わりにpopover-append-to-body = "true"を使ってみました。まだ運がない。

Answer 1

ポップオーバーが表示されない理由は、ui-gridがデフォルトでオーバーフロースタイル要素を許可しないためです。ポップオーバーをグリッド自体の上に表示するには、ui-gridのcssクラスの2つを変更することでトリッキーですが実行可能になる可能性があります。

これらのオーバーフロー属性はもともとは隠されているため、「可視」に変更します。

これを行うことで他のスタイルの問題に遭遇するかもしれないので、これは難しいかもしれません。たとえば、ヘッダーがグリッドの幅よりも広い場合などです。