twitter-bootstrap - AngularJSからTwitterBootstrapPopoverへの動的データの表示

Question

BootstrapPopoverをAngularUIパススルーを使用してAngularJSの動的にバインドされたデータで動作させることを試みていました。私のフィドルでは、オフィスの場所のタイトルと各オフィスの人々のリストを動的に表示することができません：http: //jsfiddle.net/stevenng/wmJtr/3/

Answer 1

officeこれを行う1つの方法は、次のui-optionsように参照することです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>    

これを行う別の方法は、この fiddleui-optionsのように現在のアイテムを渡す関数を生成することです。

この HTML スニペットを使用すると、次のようになります。

<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(',') };
}      

Answer 2

ここでは、ブートストラップコンポーネントのいくつかが機能しています：https ：//github.com/angular/angular.js/blob/v1.0.x/src/bootstrap/bootstrap.jsおそらく、ポップオーバーのインスピレーションとして使用できますか？