Cannot set property 'dir' of undefined ckeditor in Angular2

问题

I am getting "Cannot set property 'dir' of undefined" whenever I try to load Ckeditor. I am using angular-cli for development of my Angular2 application.

CKEditor version : 4.4.7

When i run the application using ng serve. This issue doesn't reproduce but when i run this application using ssl then i get this issue for CKEditor.

I have added basepath in index.html but still facing the issue.

I have tried this : 1)

<script type="text/javascript">
 window.CKEDITOR_BASEPATH = '//localhost/assets/axp-dev-portal/ckeditor/';
</script>
<script src="//localhost/assets/axp-dev-portal/ckeditor/ckeditor.js"></script>

<script type="text/javascript">
 window.CKEDITOR_BASEPATH = '/assets/ckeditor/';
</script>
<script src="/assets/ckeditor/ckeditor.js"></script>

<script type="text/javascript">
 var CKEDITOR_BASEPATH = '/assets/ckeditor/';
</script>
<script src="/assets/ckeditor/ckeditor.js"></script>

In document.ts file :

focusFunction() {

            if (window['CKEDITOR'].instances['prodAPIDoc'] == undefined) {
                window['CKEDITOR']['inline']('prodAPIDoc', { customConfig: '../../../assets/ckeditor/config.js' });
        }
    }

document.html

<div  id="prodAPIDoc" [attr.contenteditable]="isEditable" 
      style="text-align: left; position: relative;margin-left:5px;" [innerHTML]="documentation | sanitizeHtml"
      (focus)="focusFunction()">

~~I want to use ckeditor.js instead of ng2-ckeditor.~~

~~How to implement ng2-editor as inline in angular2 ?~~ I implemented ng2-ckeditor as inline but i am getting the below error.

Error :

vendor.abcb022….bundle.js:1262 EXCEPTION: Cannot set property 'dir' of undefinedt.handleError @ vendor.abcb022….bundle.js:1262next @ vendor.abcb022….bundle.js:736e.object.i @ vendor.abcb022….bundle.js:785e.__tryOrUnsub @ vendor.abcb022….bundle.js:1e.next @ vendor.abcb022….bundle.js:1e._next @ vendor.abcb022….bundle.js:1e.next @ vendor.abcb022….bundle.js:1e.next @ vendor.abcb022….bundle.js:22e.emit @ vendor.abcb022….bundle.js:785t.triggerError @ vendor.abcb022….bundle.js:841onHandleError @ vendor.abcb022….bundle.js:841t.handleError @ vendor.abcb022….bundle.js:2158n.runTask @ vendor.abcb022….bundle.js:2158invoke @ vendor.abcb022….bundle.js:2158
vendor.abcb022….bundle.js:1262 ORIGINAL STACKTRACE:t.handleError @ vendor.abcb022….bundle.js:1262next @ vendor.abcb022….bundle.js:736e.object.i @ vendor.abcb022….bundle.js:785e.__tryOrUnsub @ vendor.abcb022….bundle.js:1e.next @ vendor.abcb022….bundle.js:1e._next @ vendor.abcb022….bundle.js:1e.next @ vendor.abcb022….bundle.js:1e.next @ vendor.abcb022….bundle.js:22e.emit @ vendor.abcb022….bundle.js:785t.triggerError @ vendor.abcb022….bundle.js:841onHandleError @ vendor.abcb022….bundle.js:841t.handleError @ vendor.abcb022….bundle.js:2158n.runTask @ vendor.abcb022….bundle.js:2158invoke @ vendor.abcb022….bundle.js:2158
vendor.abcb022….bundle.js:1262 TypeError: Cannot set property 'dir' of undefined
    at Object.t (main.d2b46cd….bundle.js:4)
    at c (main.d2b46cd….bundle.js:4)
    at Array.p (main.d2b46cd….bundle.js:4)
    at u (main.d2b46cd….bundle.js:4)
    at HTMLScriptElement.CKEDITOR.env.ie.CKEDITOR.env.version.i.$.onerror (main.d2b46cd….bundle.js:4)
    at HTMLScriptElement.e [as __zone_symbol___onerror] (vendor.abcb022….bundle.js:2130)
    at t.invokeTask (vendor.abcb022….bundle.js:2158)
    at Object.onInvokeTask (vendor.abcb022….bundle.js:841)
    at t.invokeTask (vendor.abcb022….bundle.js:2158)
    at n.runTask (vendor.abcb022….bundle.js:2158)
    at HTMLScriptElement.invoke (vendor.abcb022….bundle.js:2158)

来源：https://stackoverflow.com/questions/43342556/cannot-set-property-dir-of-undefined-ckeditor-in-angular2

标签

javascript

angular

ckeditor

ckeditor4.x