如何在angular Directive中定位动态生成的id {{element}}

Question

我有一个要求，我已经创建了如下指令：

app.directive('popOver', function ($compile) {
    return {
        restrict: "A",
        link: function (scope, element, attrs) {
            // get template
            var templateId = element.data('popover-template');
            var templateHtml = $('#' + templateId).html();
            // compile content and class
            var popover_content = $compile(templateHtml)(scope);
            var popover_class = element.data('popover-class');            

在html页面中，我已将ID作为角色表达式传递，如下面的

data-popover-template="{{field.popoverid}}" 

运行代码后，我收到错误Error: Syntax error, unrecognized expression: {{field.popoverid}}。

有人可以帮我解决这个问题吗？

Answer 1

错误不言自明：data-popover-template需要一个表达式。所以试试这个：

data-popover-template="field.popoverid"

表达式插值结果{{}}不再是表达式，因此指令在这种情况下不能设置数据绑定。