twitter-bootstrap 带有 Bootstrap 弹出框的 Angular。如何在生成的弹出框主体中应用绑定?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/16759351/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Angular with Bootstrap popovers. How to apply bindings in generated popover's body?
提问by Ievgen Martynov
I want to use bootstrap popovers as dialogs.
我想使用引导弹出窗口作为对话框。
<a popover href="#"
data-toggle="popover" title=""
data-html="true"
data-content=
"<p>Are you sure? {{contact.FirstName}} will be removed!</p>
<button class='btn'>Yes</button>
<button ng-click='cancel()' class='btn'>Cancel</button>"
data-original-title="Remove Contact">Remove</a>
JS:
JS:
var ang = angular.module("ang", []);
ang.controller("angCtrl", function($scope) {
$scope.contact = {
Id: 1,
FirstName: "John",
LastName: "Doe"
};
$scope.cancel = function() {
console.log('Cancel called');
};
});
ang.directive("popover", function() {
return {
restrict: "A",
link: function (scope) {
scope.$watch("contacts", function () {
$("a[data-toggle=popover]")
.popover()
.click(function (e) {
e.preventDefault();
});
});
}
};
});
The problem is bootarap generates popover html after angular has applied its bindings. How can I include a new generated popover?
问题是 bootarap 在 angular 应用其绑定后生成 popover html。如何包含新生成的弹出框?
Thanks in advance!
提前致谢!
采纳答案by Ievgen Martynov
http://mgcrea.github.io/angular-strap/#/popoverPopover directives/popover.js
http://mgcrea.github.io/angular-strap/#/popoverPopover 指令/popover.js
Fetches an external html partial (or an inline ng-template) and populates the popover with its content.
获取外部 html 部分(或内联 ng 模板)并用其内容填充弹出窗口。
回答by Ahmad Alfy
For inconsistencies like this, consider using Angular directives for Twitter's Bootstrap. This might not answer your question, but it will make your life easier.
对于此类不一致,请考虑对 Twitter 的 Bootstrap使用Angular 指令。这可能无法回答您的问题,但它会让您的生活更轻松。
I ran into a few problems like this when I tried to use Bootstrap with Angular so I decided to move to the mentioned directives and it solved all troubles.
当我尝试在 Angular 中使用 Bootstrap 时遇到了一些这样的问题,所以我决定转向上述指令,它解决了所有问题。

