如何在给定条件下禁用href

How to disable an href given a condition?

本文关键字：href 条件下      更新时间：2023-09-26

我有一个链接，需要根据用户的权限禁用它。以下是链接的htmn：

<div ng-repeat="userAgreement in journalist.userAgreements">
    <div class="row" ng-repeat="attachment in userAgreement.attachments">
        <div class="col-sm-12" style="color: #2a98d4">
            <ul style="margin-bottom: 0px; padding-left: 1.5em;">
                <li class="fa fa-check-circle" style="font-size: 1.1em; margin: 3px;">
                    <a target="_blank" href="{{attachment.url}}" ng-click="agreementPermission($event)" class="cursor-pointer" style="font-family: FranklinITCProLight">{{getAttachmentName(userAgreement.agreement, attachment)}}</a>
                </li>
            </ul>
        </div>
    </div>
</div>
<div ng-show="!hasAttachments">
    <div class="col-sm-12" style="color: #2a98d4">
        <ln code="journalist.completed.documents.empty" args=""></ln>
    </div>
</div>
</div>

(ng-click不工作(

以下是该文件的js指令：

define(["app"], function (app) {
    return app.directive('completedAgreements',[
        function () {
            return {
                restrict: 'E',
                templateUrl: '/directives/completed-agreements.html',
                link: function ($scope, elm, attrs) {
                    $scope.hasAttachments = false;
                    $scope.getAttachmentName = function(agreement, attachment) {
                        $scope.hasAttachments = true;
                        if(attachment.templateId) {
                            return attachment.name;
                        } else {
                            if(agreement.type == 'DIRECT_DEPOSIT') {
                                return "Payment Documents"
                            } else {
                                var specialization = agreement.specialisation.toLowerCase();
                                return specialization.charAt(0).toUpperCase() + specialization.slice(1) + " Agreement";
                            }
                        }
                    }
                }
            };
        }
    ])
});

ng点击中的功能：

$scope.agreementPermission = function(e) {
            if (!SecurityService.canViewAgreements()) {
                showError($uibModal, "You do not have permission to access this attachment. Please contact an administrator.", null, null, null, null, "Access Denied");
                e.preventDefault();
            }
        };

由于我是javascript的新手，我不确定这个函数是否在正确的位置。它是另一个控制器文件，应该在html的js指令中吗？因此，基本上，当没有权限的用户单击链接时，会触发showError框，如果他们确实有权限，则页面会重定向到该链接。如有任何建议，我们将不胜感激！如果我应该提供更多信息，请告诉我！：-(

a.disable{
    pointer-events: none; 
}
<!--You can add css class to disable the link (anchor), example: -->
<a ng-class="{'disable': isAvailable(product.id)}">see product</a>

将标签<a>标签重写为<a disabled>

参见http://www.w3schools.com/tags/ref_attributes.asp

它也应该可以通过javascript作为对象进行编辑。寻找类似的东西：

object = document.getElementById("MyElem");
object.disabled = true;

或

object.active = false;

使用按钮而不是链接。给它CSS class="btn-btn链接"(引导(。点击时调用agreementPermission函数。

onclick="onClickFunc(event, {{ element.id or class }})"
function onClickFunc(event, somedata) {
    event.preventDefault(); // Stops the default behavior
    // ...
}

//event.prventDefault((；停止链接的默认行为。

相关文章：