Hello, I'm using "CKEditor Inline 4" and came across some operating problems, the biggest one is when I delete all editing characters in a "button" component and then I can not add more content, opens the edit box over the field but can not put new content, it also occurs at times when I use an elemnto "div", can anyone help me with this problem? I am using the following directive to instantiate CKEditor:
directive('editableText',function($parse){
//Opções para ckeditor
var ckOptions = {
toolbarGroups: [
{ name: 'document', groups: [ 'mode', 'document' ] },
{ name: 'clipboard', groups: [ 'clipboard', 'undo' ] },
'/',
{ name: 'basicstyles', groups: [ 'basicstyles', 'cleanup' ] },
{ name: 'links' },
{ name: 'colors', groups: ['colors'] }
],
disableAutoInline: true,
disableNativeSpellChecker: false,
uiColor: '#FAFAFA',
enterMode : CKEDITOR.ENTER_BR,
shiftEnterMode: CKEDITOR.ENTER_P
};
CKEDITOR.dtd.$editable.span = 1
CKEDITOR.dtd.$editable.button = 1
CKEDITOR.dtd.$editable.a = 1
return {
restrict: 'A',
require: 'ngModel',
link:function(scope,elm,attrs,ngModel){
//Cria get e set
var getter = $parse(attrs.ngModel),
setter = getter.assign;
//Adiciona atributo content editable = true
attrs.$set('contenteditable', true);
//Altera o plugin de salvar do CKEDITOR
CKEDITOR.plugins.registered['save'] =
{
init: function (editor) {
editor.addCommand('save',
{
modes: { wysiwyg: 1, source: 1 },
exec: function (editor) {
if (editor.checkDirty()) {
var ckValue = editor.getData();
scope.$apply(function () {
setter(scope, ckValue);
});
ckValue = null;
}
}
}
);
}
};
ckOptions.on = {
blur: function (e) {
if (e.editor.checkDirty()) {
var ckValue = e.editor.getData();
scope.$apply(function () {
setter(scope, ckValue);
});
ckValue = null;
}
}
};
ckOptions.extraPlugins = 'sourcedialog,panelbutton,floatpanel,colorbutton';
ckOptions.removePlugins = 'sourcearea';
var editorAngular = CKEDITOR.inline(elm[0], ckOptions);
scope.$watch(attrs.editableText, function (value) {
editorAngular.setData(value);
});
editorAngular.on('instanceReady', function() {
scope.$apply(function() {
editorAngular.setData(ngModel.$viewValue);
});
});
CKEDITOR.config.baseFloatZIndex = 99;
CKEDITOR.config.allowedContent = true;
CKEDITOR.config.extraAllowedContent = '*(*)';
}
};
