angular-contenteditable

angular model for the 'contenteditable' html attribute

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
angular-contenteditable
0.3.96 years ago7 years agoMinified + gzip package size for angular-contenteditable in KB

Readme

angular-contenteditable
Build Status Dependency Status endorse
An AngularJS directive to bind html tags with the contenteditable attribute to models.

Install

bower install angular-contenteditable

Usage

angular.module('myapp', ['contenteditable'])
  .controller('Ctrl', ['$scope', function($scope) {
    $scope.model="<i>interesting</i> stuff"
  }])

<div ng-controller="Ctrl">
  <span contenteditable="true"
        ng-model="model"
        strip-br="true"
        strip-tags="true"
        select-non-editable="true">
  </span>
</div>

Notice

The directive currently does not work in any version of Internet Explorer or Opera < 15. Both browsers don't fire the input event for contenteditable fields.
In Chrome, when a contenteditable element X contains a non-contenteditable element Y as the last element, then the behaviour of the caret is the following:
  • When X has style display set to block or inline-block, then the caret
moves to the very far right edge of X when it is immediately at the end of X (inserting spaces moves the caret back).
  • When X has style display set to inline, then the caret disappears instead.

Development

npm install
bower install
grunt