How to add a placeholder in CKEditor 5?

Question

import BalloonEditor from '@ckeditor/ckeditor5-editor-balloon/src/ballooneditor';

import Essentials from '@ckeditor/ckeditor5-essentials/src/essentials';
import Paragraph from '@ckeditor/ckeditor5-paragraph/src/paragraph';
import Bold from '@ckeditor/ckeditor5-basic-styles/src/bold';
import Italic from '@ckeditor/ckeditor5-basic-styles/src/italic';

BalloonEditor
                .create( elem, {
                    plugins: [ Markdown, Essentials, Paragraph, Bold, Italic ],
                    toolbar: [ 'bold' ]
                })
                .then((editor) => {
                    ....
                })
                .catch( error => {
                    console.error( error );
                } );

I tried to use attachPlaceholder from https://ckeditor.com/docs/ckeditor5/latest/api/module_engine_view_placeholder.html#static-function-attachPlaceholder

import { attachPlaceholder } from "@ckeditor/ckeditor5-engine/src/view/placeholder";

Could you show me simple example how to use this method (attachPlaceholder) or how to do it.

Answer 1

In CKEditor-5 you can add placeholder like

  <ckeditor [config]="{ placeholder:'Placeholder Text', toolbar: [ 'bold', 'italic', 'bulletedList' ] }">
  </ckeditor>

See docs