锚定标签无法点击

Question

I have an anchor tag and want to make it disable for click in particular conditions. I wrote a directive, but it doesn't work. Can somebody tell me where I am wrong. When I used button, everything works, but I need anchor tag.

In controller, I vave already set linkEnabled to false

<a my-link="linkEnabled" title="Delete" ng-if="row.entity.status === 0" ng-click ng-really-title="Delete Item"
       ng-really-no="Cancel" ng-really-yes="Delete"
       ng-really-message="Are you sure you want to permanently delete {{row.entity.filename}}?"
       ng-really-click="grid.appScope.deleteItem(row.entity)" class="text-danger">
        <i class="fa fa-trash-alt fa-lg"></i>
    </a> 

Here is my directive:

'use strict';

angular.module('modio.credentialing')
    .directive('myLink', function () {
        return {
            scope: {
                enabled: '=myLink'
            },
            link: function (scope, element, attrs) {
                element.on('click', function (event) {
                    if (!scope.enabled) {
                        event.preventDefault();
                    }
                });
            }
        }
    }); 

Answer 1

You don't need a custom directive for that. You can disable links using css .

To apply conditional CSS class use ng-class .