我正在使用“可拖动”指令来支持图像拖动。但是,根据用户的角色,我需要为某些用户组禁用图像拖动。我使用了以下代码。
<!--draggable attribute is used as handle to make it draggable using jquery event-->
<li ng-repeat="template in templates" draggable id="{{template._id}}" type="template" class="template-box">
<!-- Images and other fields are child of "li" tag which can be dragged.-->
</li>
该方法dragSupported
在模板范围内,并返回true
或false
。我不想为所返回的每个值创建两个大的重复<li>
元素。换句话说,我不是在寻找以下方法来解决此问题。ng-if
dragSupported()
<!--draggable attribute is used as handle to make it draggable using jquery event-->
<li ng-if="dragSupported() ==true" ng-repeat="template in templates" draggable id="{{template._id}}" type="template" class="template-box">
<!-- Images and other fields are child of "li" tag which can be dragged.-->
</li>
<!--remove "draggable" directive as user doesn't have permission to drag file -->
<li ng-if="dragSupported() !=true" ng-repeat="template in templates" id="{{template._id}}" type="template" class="template-box">
<!-- Images and other fields are child of "li" tag which can be dragged.-->
</li>
还有其他方法可以避免代码重复吗?
ng-attr-<attrName>
Angular包含对有条件声明HTML属性的支持,作为动态标题ng-attr-<attrName>
指令。
在您的情况下,代码可能如下所示:
<li
id="{{template._id}}"
class="template-box"
type="template"
ng-repeat="template in templates"
ng-attr-draggable="dragSupported() === true"
></li>
这包含以下值用法的示例:true
,false
,undefined
,null
,1
,0
,和""
。请注意,通常为假的值可能如何产生意外结果。
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句