I am trying to use this inline
mode but I am having a lot of problems with it. Some how the style is being removed and I am getting this error about reading 'config'
. I wanted to make sure I was setting the config for this control my using the object editor
. Any help would be great.
Cannot read properties of undefined (reading 'config')
view
<div class="col-sm-10">
<div class="controls">
<textarea id="indicationElementId"
formControlName="indicationContent"
class="form-control"
[(ngModel)]="item.ValueName"
placeholder="Indication text"
[class.has-error]="indicationContentNeedsErrorClass">
</textarea>
</div>
</div>
ts
CKEDITORInitializer() {
if ((<any>window).CKEDITOR.instances.indicationElementId)
(<any>window).CKEDITOR.instances.indicationElementId.destroy();
(<any>window).CKEDITOR.instances["indicationElementId"];
let editor = (<any>window).CKEDITOR.inline("indicationElementId", {
keystrokes: [
[13 /*Enter*/, 'doNothing'],
[(<any>window).CKEDITOR.SHIFT + 13, 'doNothing']
],
enterMode: 2,
toolbar: [
{ name: 'basicstyles', items: ['Bold', 'Italic', 'Subscript', 'Superscript'] },
{ name: 'insert', items: ['SpecialChar'] },
{ name: 'source', items: ['Sourcedialog'] }
],
specialChars: ['©', '®', '–', '¾', '≥', '≤'],
removeButtons: '',
extraPlugins: 'sourcedialog'
});
editor.CKEDITOR.config.allowedContent = true;
editor.CKEDITOR.config.autoParagraph = false;
editor.CKEDITOR.disableAutoInline = true;
editor.on("change", () => {
this.ngZone.run(() => {
this.item.ValueName = this.getContent();
this.indicationContentChanged.next(null);
});
});
output
the problem is trying to set the config. Can try:
editor.config.set('allowedContent', true);
editor.config.set('autoParagraph', false);
editor.config.set('disableAutoInline', true);
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With