4

我有一个包含在 $templateCache 中的视图中的模板。

<script type="text/ng-template" id="ratesPopover">
    <table class="rate-table">
        <tr ng-repeat="rate in plan.rates">
            <td>Rate</td>
            <td>{{rate}}</td>
        </tr>
    </table>
</script>

然后我有一个指令，我想用传入的范围编译模板，但我不希望模板被绑定。我只希望 $compile 服务将模板编译为 HTML 的静态字符串，这样我就可以将它添加到数据内容属性中的 Twitter Bootstrap Popover 中。不需要双向绑定。

var template = angular.element('<div>' + $templateCache.get('ratesPopover') + '</div>'),
    popover = $compile(template)(scope);

element.attr('data-content', popover.html());

当我显示弹出框时，我看到的是没有插入变量的编译模板。关于我可能做错了什么的任何想法？

4

2 回答 2

3

尝试注入$interpolate模块然后执行

var template = '<div>' + $templateCache.get('ratesPopover') + '</div>',
    popover = $interpolate(template)(scope);

element.attr('data-content', popover);
于 2013-09-03T04:56:01.227 回答
0

这个问题很老，但我的回答可能对其他人有所帮助，我最近遇到了同样的问题。

要插入您需要执行 scope.$apply 的值：

var template = angular.element('<div>' + $templateCache.get('ratesPopover') + '</div>'),
    popover = $compile(template)(scope);

scope.$apply(function () {
    // popover is now interpolated
});

如果你已经在 $digest 循环中，那么调用 $apply 会抛出一个错误，在这种情况下你只需要等到 digest 循环结束：

var template = angular.element('<div>' + $templateCache.get('ratesPopover') + '</div>'),
    popover = $compile(template)(scope);

$timeout(function () {
    // popover is now interpolated
});
于 2016-02-02T22:22:01.150 回答