not display HTML data using API

[sanjaypraja]

Hi,
I have tried to implement HTML editor in my project everything is working fine but when i tried to bind data from database using API, HTML editor does not display data in editor. if tried to bind data with class property then it works. Please look it.

[kzimny]

How the ckeditor is configured? Can you post your code?

[sanjaypraja]

*Binding in .html file
<ckeditor [(ngModel)]="componentDetails.componentData" name="componentDetails.componentData" debounce="500" [config]="{uiColor: '#99000'}">

*in .ts file, we call api request in ngOnInit() get the data and bind into "componentDetails" object

this.sub = this.route.params.subscribe(params => {
let id = params['id'];
this.service.getComponentDetails(id)
.subscribe(
body => {
this.componentDetails = body.data;
},
error => this.handleError
)
})

I have done few R&D and find that data bind ng-reflect-model in ckeditor but not bind in editor html body.

[kzimny]

Appropriated to your html code, the date should be loaded in iframe. Maybe something is set wrong in the config.js file? Can you try to load the ckeditor from CDN repository, just for a test? Load the ckeditor from CDN as follow:
<script src="https://cdn.ckeditor.com/4.5.11/full-all/ckeditor.js"></script>

[sanjaypraja]

tried with new CDN path but not success :( . I think problem with delay in data binding bcz when i tried with class property with hard code value, it's binding.

[kzimny]

try to load data without promise method. look at this thread

[sanjaypraja]

we are not using promise method. I tried to debug script and find that sometime CKEditorComponent is calling ( then data bind) and sometime it is not calling (then data not bind).

[sanjaypraja]

problem has been resolved. In thread to use [config]="{extraPlugins: 'divarea'}".