javascript - 如何在 Angular 中禁用 img？

Question

我有一个 img，它有一个处理点击事件的属性指令。我希望能够禁用和启用处理程序。我该怎么做？

JS

.directive('choose', function() {
    return {
        restrict: 'A',
        link: function(scope, el, attrs) {
            el.on('click', function() {
                scope.$apply(function() {
                    // stuff
                    // disable el
                });
            });
        }
    };
})
.controller('QuizCtrl', function ($scope, Quiz, $routeParams) {
    this.next = function() {
        // enable ALL els
    };
});

HTML

<img choose />
<button ng-click="q.next()">Next</button>

Answer 1

您也可以使用 css 来做到这一点:

JS

.directive('choose', function() {
    return {
        restrict: 'A',
        link: function(scope, el, attrs) {
            el.on('click', function() {
                scope.$apply(function() {});
            });
            scope.enable = function(){
                el.css({pointerEvents: ''});
            };
            scope.disable = function(){
                el.css({pointerEvents: 'none'});
            };
        }
    };
})