twitter-bootstrap - 带有 Bootstrap 弹出框的 Angular。如何在生成的弹出框主体中应用绑定？

Question

我想将引导弹出窗口用作对话框。

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

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

问题是 bootarap 在 angular 应用了它的绑定后生成 popover html。如何包含新生成的弹出框？

提前致谢！

Answer 1

http://mgcrea.github.io/angular-strap/#/popover Popover 指令/popover.js

获取外部 html 部分（或内联 ng 模板）并使用其内容填充弹出框。

Answer 2

对于像这样的不一致，考虑使用Angular 指令用于 Twitter 的 Bootstrap。这可能无法回答您的问题，但它会让您的生活更轻松。

当我尝试将 Bootstrap 与 Angular 一起使用时遇到了一些类似的问题，所以我决定转向上述指令，它解决了所有问题。