在Angular指令模板中有条件地添加数据属性
我正在编写一个指令的模板。如果作用域中的属性设置为true，则应将data-toggle="dropdown"附加到该元素。如果变量为false，则此数据属性不应呈现为元素的属性。
例如，如果作用域变量为true，则模板应呈现：
<span data-toggle="dropdown"></span>如果为false，则模板应呈现：
<span></span>要实现这一点，模板应该是什么样子的？
例如，我知道我可以使用ng-class来有条件地包含一个类。如果我想让模板呈现这个：
<span class="dropdown"></span>那么我的模板应该是这样的：
"<span ng-class="{ 'dropdown': isDropDown }"></span>如果作用域变量isDropDown为false，那么模板将简单地呈现：
<span></span>因此，在模板中有一种方法可以有条件地添加class="dropdown"。是否存在允许我有条件地添加data-toggle="dropdown"的模板语法
我尝试过的模板之一是：
"<span data-toggle="{ 'dropdown': isDropDown }"></span>我对上面的模板的想法是，如果作用域变量isDropDown为真，则data-toggle的值将被设置为"dropdown“。如果isDropDown为false，则data-toggle的值将只是一个空字符串""。不过，这似乎并不管用。
回答 2
Stack Overflow用户
发布于 2015-06-05 16:35:50
<span ng-attr-data-toggle="{{isTrue && 'dropdown' || undefined }}"></span>
将在isTrue=true：<span data-toggle="dropdown"></span>时生成
当isTrue=false：<span></span>时
Stack Overflow用户
发布于 2014-02-27 03:41:02
目前，没有angular指令允许您有条件地删除或添加属性。您可以在span中执行ng-switch，一个使用该attr，另一个不使用该attr。
<div ng-switch on="condition">
<span data-toggle="dropdown" ng-switch-when="value"></span>
<span ng-switch-default></span>
</div>或
<span data-toggle="dropdown" ng-if="expression"></span>
<span ng-if="!expression"></span>您也可以为同样的目的创建一个指令(有条件地添加/删除attrs )，但这会有点复杂。
此外，如果您希望在指令中管理范围变量，则可以将其作为另一个属性进行传递。
示例：
<span data-toggle="dropdown" when="isDropDown"></span>https://stackoverflow.com/questions/22049824
复制相似问题