CKEditor 5 DiMe editor build

The DiMe editor build for CKEditor 5.

Quick start

First, install ckeditor5 for angular

npm install --save @ckeditor/ckeditor5-angular

Then, install this build

npm install @digitalmedarbeider/ckeditor-dime

Add the ckeditor module into your module imports:

import { CKEditorModule } from '@ckeditor/ckeditor5-angular';

imports: [
    CKEditorModule,
	....

And use it in your component:

import * as DimeEditor from '@digitalmedarbeider/ckeditor-dime';

export class AppComponent implements OnInit {
  public Editor = DimeEditor;
	....

Prepare token attributes in your component's ts file

options = [
    {
      type:"text",					// Insert Token 
      label:"Applicant Name",		// display value of token to insert 
      value:"{applicant_name}"		// actual token to insert
    },
    {
      type:"text",
      label:"Applicant Email",
      value:"{applicant_email}"
    },
    {
      type:"image",					// Insert screenshot of a div
      label:"Add Map",			
      value:"mapContainer",			// Id of the div to insert
    }
    ];

Pass the attribute

<ckeditor [editor]="Editor" data="<p>Hello, world!</p>" [config]="{options:options}"></ckeditor>