将动态数据从 AngularJS 显示到 Twitter Bootstrap Popover答案

【问题标题】：Displaying dynamic data from AngularJS to Twitter Bootstrap Popover将动态数据从 AngularJS 显示到 Twitter Bootstrap Popover
【发布时间】：2012-08-14 21:43:20
【问题描述】：

我试图让 Bootstrap Popover 通过 AngularUI 直通处理 AngularJS 中的动态绑定数据。在我的小提琴中，我无法动态显示办公室位置的标题和每个办公室的人员名单：http://jsfiddle.net/stevenng/wmJtr/3/

【问题讨论】：

标签： twitter-bootstrap angularjs popover

【解决方案1】：

您可以做到这一点的一种方法是在ui-options 中引用office，例如this fiddle：

<div ng-repeat="office in offices">
  <a href="" ui-jq="popover" ui-options="{title:office.location, content:office.people.join(',')}">Test Popover - {{office.location}}</a>    
</div>

另一种方法是生成ui-options，方法是通过将当前项目传入其中的函数（如this fiddle）。

有了这个 html sn-p:

<div ng-repeat="office in offices">
  <a href="" ui-jq="popover" ui-options="popoverOptions(office)">Test Popover - {{office.location}}</a>    
</div>

还有这个控制器代码：

$scope.offices = [
    {location:'Europe', people:['andy','gloopy']},
    {location:'USA', people:['shaun','teri']},
    {location:'Asia', people:['ryu','bison']}];

$scope.popoverOptions = function(office){
    return { title: office.location,
             content: office.people.join(',') };
}

【讨论】：

【解决方案2】：

我们这里的引导组件很少：https://github.com/angular/angular.js/blob/v1.0.x/src/bootstrap/bootstrap.js 也许您可以将其用作弹出窗口的灵感？

【讨论】：