Angular: Empty Fiddle
http://angularjs.org/
HTML
<script src="http://code.angularjs.org/1.1.5/angular.min.js"></script>
<div ng-controller="MyCtrl">
<a a-disabled="foo" ng-click="alert()">click me</a>
<br/>
<button ng-click="foo=!foo">toggle disabledness</button>
</div>
JavaScript
var myApp = angular.module('myApp', []);
function MyCtrl($scope) {
$scope.alert = function () {
alert('obviously not disabled');
};
}
myApp.directive('aDisabled', function ($compile) {
return {
restrict: 'A',
priority: -99999,
link: function (scope, element, attrs) {
var oldNgClick = attrs.ngClick;
if (oldNgClick) {
scope.$watch(attrs.aDisabled, function (val, oldval) {
console.log(val);
if ( !! val) {
element.unbind('click');
} else if (oldval) {
attrs.$set('ngClick', oldNgClick);
element.bind('click', function () {
scope.$apply(attrs.ngClick);
});
}
});
}
}
};
});