向指令元素添加指令属性 [英] 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>
所以本质上,如果 show-more
等于 true,则将 {{myNewAttrDirective}}
替换为我拥有的属性指令,即 my-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 中,我只剩下 <li {{myNewAttrDirective}}>Home</li>
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屋!