Preventing default on a checkbox doesn't prevent ng-model changing

Due to some animations, a visual glitch occurs if users toggle the state of a a checkbox too quickly.

To prevent this happening, I wanted to limit the frequency with which the state could be changed. I thought a neat way to do this would be a directive.

I've successfully made a directive that prevents ng-click triggering at more than a certain frequency, but have a specific issue with checkboxes.

Here's the directive code (coffeescript):

angular.directive 'pxnMaxClickFreq', ($timeout)->

  restrict: 'A'

  # Make sure our event binding runs before any other directive
  priority: -100

  link: (scope, element, attributes)->
    timer = false
    element.on 'click', (e)->
      if timer
        e.preventDefault()
        e.stopImmediatePropagation()
      else
        timer = true
        $timeout( (-> timer = false), attributes.pxnMaxClickFreq )

And a plunker that demonstrates my issue.

Summary

ngModel is being updated when the checkbox it is specified on is clicked even when the default is prevented causing the checkbox never to be checked. How can I avoid this?

Ideally I don't want to have to integrate with the ngModelController as I'd like to keep the directive as abstract as possible.