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/Hiển thị dữ liệu động từ AngularJS đến Twitter Bootstrap Popover
8
A
Trả lời
5
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(',') };
}
3
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?
Các vấn đề liên quan
- 1. Twitter bootstrap .popover không hoạt động
- 2. Fullcalendar với Twitter Bootstrap Popover
- 3. Twitter Bootstrap: Popover vs Tooltip?
- 4. twitter popstrap popover không hoạt động với angularjs
- 5. định vị một popover sử dụng twitter bootstrap
- 6. Twitter Bootstrap .on ('show', function() {}); không làm việc cho popover
- 7. "popover" vấn đề trên twitter bootstrap thư viện css/javascript
- 8. Bootstrap popover ẩn ngắt dòng
- 9. gửi dữ liệu từ angularjs đến django
- 10. CHỈ cần gì cho Popover của Twitter Bootstrap?
- 11. Twitter bootstrap: Popovers không hiển thị lên trên nhấp chuột đầu tiên nhưng hiển thị trên nhấp chuột thứ hai
- 12. Twitter Bootstrap Responsive - Chỉ hiển thị Cột Bảng trên Desktop
- 13. Bootstrap popover không hoạt động trong Chrome
- 14. AngularJS: hiển thị tải HTML cho đến khi dữ liệu được tải
- 15. Vấn đề hiển thị nhập văn bản với Twitter Bootstrap
- 16. Twitter Bootstrap cửa sổ kiểu hiển thị flickers
- 17. Hiển thị html trong @ html.actionlink với Twitter Bootstrap
- 18. Twitter Bootsrap: Popover và Tự động làm mới
- 19. Bootstrap: popover trên các phương thức
- 20. Tại sao thuộc tính tiêu đề html và dữ liệu khởi động twitter-gốc-tựa đề loại trừ lẫn nhau?
- 21. Làm cách nào để vô hiệu hóa tiêu đề trong plugin popover của Twitter Bootstrap?
- 22. Twitter Bootstrap, hiển thị tất cả các popovers tại một div
- 23. hiển thị dữ liệu khi sử dụng khung khởi động
- 24. Bootstrap Popover nội dung nhấp khi ẩn
- 25. Glyphicons từ bootstrap không hiển thị
- 26. Twitter bootstrap typeahead delay
- 27. Hiển thị nguồn cấp dữ liệu Twitter từ ứng dụng Rails
- 28. Hộp thoại hiển thị AngularJS từ routeProvider
- 29. CakePHP với Bootstrap (từ Twitter)
- 30. trái Positioning Một Bootstrap Popover
liên kết không hoạt động nữa – Alp
Tôi đã cập nhật liên kết. –