Skip to content

Instantly share code, notes, and snippets.

@roparz
Last active August 29, 2015 14:25
Show Gist options
  • Save roparz/b10425d9c5b97c22991c to your computer and use it in GitHub Desktop.
Save roparz/b10425d9c5b97c22991c to your computer and use it in GitHub Desktop.
cg-contenteditable - AngularJS directive to manage contenteditable element (in CoffeeScript)
angular.module('whatever').directive 'cgContenteditable', ->
restrict: 'A'
scope:
ngModel: '='
link: (scope, elem, attrs) ->
elem = elem[0]
# 1
elem.setAttribute 'contenteditable', true
# 2
elem.addEventListener 'input', ->
return if scope.ngModel is elem.innerHTML
scope.ngModel = elem.innerHTML
scope.$evalAsync()
# 3
scope.$watch 'ngModel', ->
return unless scope.ngModel
return if scope.ngModel is elem.innerHTML
elem.innerHTML = scope.ngModel
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment