Hiển thị dữ liệu động từ AngularJS đến Twitter Bootstrap Popover

Question

Tôi đã cố gắng để Bootstrap Popover hoạt động với dữ liệu được liên kết động trong AngularJS với phép chuyển đổi AngularUI. Trong fiddle tôi tôi không thể tự động hiển thị tiêu đề của địa điểm văn phòng và danh sách những người trong mỗi văn phòng: http://jsfiddle.net/stevenng/wmJtr/3/

Answer 1

Một cách để bạn có thể làm điều này là bởi chỉ tham khảo office trong ui-options như this fiddle sự:

<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>  

Một cách khác bạn có thể làm điều này là tạo ra các ui-options thông qua một chức năng đi qua trong mục hiện tại vào nó như this fiddle.

Với đoạn này html:

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

Và mã điều khiển này:

$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

Chúng tôi có vài người trong số các thành phần bootstrap làm việc ở đây: https://github.com/angular/angular.js/blob/v1.0.x/src/bootstrap/bootstrap.js có lẽ bạn có thể sử dụng nó như là nguồn cảm hứng cho popover của bạn?