Question

我正在尝试使用http://getbootstrap.com/javascript/#popovers-examples

中的代码

<button type="button" class="btn btn-lg btn-danger" 
data-toggle="popover" title="Popover title" 
data-content="And here's some amazing content. It's very engaging. Right?">
   Click to toggle popover
</button>

但是我无法绑定到属性“data-content”，它会给我以下错误。

无法绑定到'content'，因为它不是'span'
的已知属性

这是我的角度代码

<span data-toggle="popover" class="fa fa-exclamation-circle fa-lg" [data-content]="getTooltipMsg('lastName')"></span>

如何解决此问题？

Answer 1

Angular默认使用属性绑定，但int i; int j; for (i = line - 1; i < boat.getLength()+1; i++) { for (j = col - 1; j < boat.getLength()+1; j++) {元素上没有data-content属性，并且似乎也没有带span输入的Angular组件或指令在这个元素上。

因此您需要使用属性绑定：

data-content

Answer 2

我建议使用一个提供Angular + Bootstrap集成的专用库 - 这样的库打开一个popover变得如此简单：

<span [ngbPopover]="getTooltipMsg('lastName')" popoverTitle="Some title" class="fa fa-exclamation-circle fa-lg" ></span>

以下是使用ng-bootstrap库的实时示例：http://plnkr.co/edit/gTSxuZjx2ovkBAX0GWYQ?p=preview

像ng-bootstrap这样的专用库不仅提供了在Angular生态系统中感觉自然的API，而且还允许您放弃对jQuery的依赖。

如何绑定到数据内容？

2 个答案: