Metronic 8 Angular CKEditor integration

Readme.md

!!! Check out the official documentation of CKEditort first https://ckeditor.com/docs/ckeditor4/latest/guide/dev_angular.html.

1. Run the command: yarn add ckeditor4-angular.
2. import CKEditorModule to your application.
3. Add variable editorData and method onChange into code behind (See example in your.component.ts file).
4. Add ckeditor into your HTML markup (See example in your.component.html file).

your.component.html

<div>
  <ckeditor [data]="editorData" (change)="onChange($event)"></ckeditor>
</div>

your.component.ts

import { CKEditor4 } from 'ckeditor4-angular';

export class YourComponent implements OnInit {
  public editorData = '<p>Hello, world!</p>';
  
  public onChange(event: CKEditor4.EventInfo) {
    this.editorData = event.editor.getData();
    console.log(this.editorData);
  }
}

your.module.ts

import { CKEditorModule } from 'ckeditor4-angular';

@NgModule( {
    imports: [
        ...
        CKEditorModule,
        ...
    ],
    …
})

...

asdf fas d asdf

dsaffasd fsad

asdfsd fad

asdfasdf

poiolp;kj c pz[xoic opizxj

jhjvjhjhbjhvh

dsfdsf

fghfghsfhhsfgh

fgsdg