Miss any of our Open RFC calls?Watch the recordings here! »

ngx-editor

5.0.0-alpha.9 • Public • Published

NgxEditor

ngxEditor

A Simple WYSIWYG Editor for Angular Applications.

Tests npm version npm npm licence

Getting Started

Installation

Install via Package managers such as npm or yarn

npm install ngx-editor --save
# or 
yarn add ngx-editor

Usage

Import ngx-editor module

import { NgxEditorModule } from 'ngx-editor';
 
@NgModule({
  imports: [NgxEditorModule],
})
 
export class AppModule {}

Then in HTML

<ngx-editor [ngModel]="jsonDoc"></ngx-editor>

For ngModel to work, You must import FormsModule from @angular/forms

Optional Configuration

import { menu, placeholder, schema } from 'ngx-editor';
 
NgxEditorModule.forRoot({
  schema, // optional scheama, see https://sibiraj.dev/ngx-editor/additional-documentation/schema.html
  plugins: [
    menu({
      // default options (Optional)
      toolbar: [
        ['bold', 'italic', 'code'], // inline icons
        ['ordered_list', 'bullet_list'],
        [{ heading: ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'] }] // dropdown
        [codemirror] // custom menu, see https://sibiraj.dev/ngx-editor/additional-documentation/menu-plugin.html
      ],
      labels: {
        bold: 'Bold',
        italics: 'Italics',
        code: 'Code',
        ordered_list: 'Ordered List',
        bullet_list: 'Bullet List',
        heading: 'Heading'
      }
    }),
    placholder('Type something here...')
  ],
  nodeViews: {} // optional, see https://prosemirror.net/examples/footnote/
});

Compatibility

All Evergreen-Browsers are supported

  • Google Chrome
  • Microsoft Edge
  • Mozilla Firefox
  • Opera

Demo

Demo at stackblitz ngx-editor

Documentation

Documentation is auto-generated using compodoc, and can be viewed here: https://sibiraj-s.github.io/ngx-editor/

Install

npm i ngx-editor

DownloadsWeekly Downloads

6,394

Version

5.0.0-alpha.9

License

MIT

Unpacked Size

591 kB

Total Files

100

Last publish

Collaborators

  • avatar