Name: angular-ckeditor
Owner: Le Monde
Description: CKEditor directive for Angular.
Created: 2014-04-23 12:10:43.0
Updated: 2018-01-19 02:36:18.0
Pushed: 2017-06-08 00:10:56.0
Homepage: null
Size: 72
Language: JavaScript
GitHub Committers
User | Most Recent Commit | # Commits |
---|
Other Committers
User | Most Recent Commit | # Commits |
---|
CKEditor directive for Angular.
r install angular-ckeditor
install angular-ckeditor
Note : obviously this plugin expects the presence of AngularJS and CKEditor.
HTML:
Load files. -->
ipt src="angular.js"></script>
ipt src="ckeditor.js"></script>
ipt src="angular-ckeditor.js"></script>
ng-controller="CkeditorCtrl">
iv ckeditor="options" ng-model="content" ready="onReady()"></div>
v>
JavaScript:
lar.module('controllers.ckeditor', ['ckeditor'])
troller('CkeditorCtrl', ['$scope', function ($scope) {
Editor options.
cope.options = {
language: 'en',
allowedContent: true,
entities: false
Called when the editor is completely ready.
cope.onReady = function () {
// ...
IMPORTANT NOTICE
Angular-ckeditor uses ng-model
. If you add an ng-if
on the element to whom this directive is attached, changes in the editor won't be forwarded to your code anymore, due to the extra scope created by ng-if
. A solution is to explicitely bypass the extra scope : ng-model="$parent.model"
. See http://stackoverflow.com/questions/18342917/angularjs-ng-model-doesnt-work-inside-ng-if
Internally, CKEditor gives a name to its instances, either the id of the element it's on or automatic name (editor1, editor2…). If you plan to look for your instances programmatically via CKEditor.istances
, be sure to give them a unique id=“…” (Beware of re-usable directives).
In a directive on the same element, you can also use :
: function (scope, element) {
r ckeditorController = element.controller('ckeditor'); // angular-ckeditor controller
r ckeditorInstance = ckeditorController.instance;
You may find this other directive useful : https://github.com/lemonde/angular-ckeditor-placeholder
MIT
.editorconfig
and .jshintrc
filesnpm install
npm test
grunt
(to generate minified version)Thanks !