添加指令属性指令元素 [英] Add Directive Attribute to Directive Element

问题描述

我有一个指令元素：

return {
        restrict: 'E',
        replace: true,
        transclude: true,
        template:   '<ul>' +
                        '<li {{myNewAttrDirective}}>Home</li>' +
                        '<li {{myNewAttrDirective}}>Products</li>' +
                        '<li {{myNewAttrDirective}}>Cart</li>' +
                        '<li {{myNewAttrDirective}}>Contact Us</li>' +
                    '</ul>',
        scope: {
              _showMore : '=showMore'
        },
        link: function(scope, element, attrs) {

            if (scope._showMore === true) {
               scope.myNewAttrDirective = 'myAnimationDirective'
            }

        }
    };

HTML

<my-directive show-more="true"></my-directive>

所以基本上，如果显示，更多的等于true，则更换 {{myNewAttrDirective}} 与属性指令我有即我-ATTR-指令。

So essentially, if show-more is equal to true, then replace {{myNewAttrDirective}} with an attribute directive i have i.e my-attr-directive.

我曾尝试与上述if语句，但预计，在html，我离开＆LT我;李{{myNewAttrDirective}}＆GT;首页＆LT; /李＆GT;

I have tried with the above if statement, but as expect, in the html, i am left with <li {{myNewAttrDirective}}>Home</li>

更新：

在我的if语句，我可以通过添加一个属性：

Within my if statement, i can add an attribute via:

var item = element.find("li");
item.attr("myAnimationDirective", "");

哪些呈现在HTML，但点击事件不响应。 （他们做的工作，如果我不过他们加入到我原来的指令）。

Which is rendered in the HTML, but the click events do not respond. (They do work if i added them to my original directive however).

推荐答案

解决加入

$compile(element)(scope);

这篇关于添加指令属性指令元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！