如何使用Angular2和Bootstrap將表格數據添加到工具提示/彈出窗口？

如果我聽起來有點缺乏經驗（我是），請耐心等待，但我目前正在嘗試使用Angular2和Bootstrap向td添加工具提示或彈出窗口（無論是否無關緊要），以最終擺脫一個不必要的列。我希望popover或tooltip在懸停時打開而不是點擊。我已經嘗試通過nodejs安裝ng2-popover模塊，正如在這裏的另一篇文章中推薦的，但無濟於事。這裏是我的表的開頭的簡化版本：如何使用Angular2和Bootstrap將表格數據添加到工具提示/彈出窗口？

<table class="table table-striped table-bordered table-hover"> 
<tbody><tr> 
<th>Table Name</th> 
<th> Max As Of Date </th> 
<th> Row Count for Date</th> 
<th> Comments </th><th> 
<td> Table Data </td>

誰推薦給別人使用NG2-酥料餅的模塊，而不是JQuery的原始傢伙建議如下：

<span popover="content to be shown in the popover"> 
element on which this popover is applied. 
</span>

然而這沒當我把TD放在那裏的時候，我不會爲我工作。如果您有任何線索，請提前感謝您如何做到這一點！

來源

2016-07-06 Allison M

https://angular-ui.github.io/bootstrap/#/tooltip –

-1

可以使用角的引導：https://angular-ui.github.io/bootstrap/#/tooltip

已經有了tooltip功能適用於角。

<div class="form-group" ng-class="{'has-error' : !inputModel}"> 
     <label>Disable tooltips conditionally:</label> 
     <input type="text" ng-model="inputModel" class="form-control" 
      placeholder="Hover over this for a tooltip until this is filled" 
      uib-tooltip="Enter something in this input field to disable this tooltip" 
      tooltip-placement="top" 
      tooltip-trigger="mouseenter" 
      tooltip-enable="!inputModel" /> 
    </div>

只需添加指令，如：

UIB-提示：要顯示的文字
提示貼裝：地方或將文本將被定位
tooltip-trigger：會出現什麼文字（可以是任何事件）

這裏的example

來源

2016-07-06 19:19:19

如何使用Angular2和Bootstrap將表格數據添加到工具提示/彈出窗口？

回答

相關問題