Quick Start

Installation

Install via Package managers such as npm or pnpm or yarn

npm

npm install @bobbyquantum/ngx-editor

pnpm

pnpm install @bobbyquantum/ngx-editor

yarn

yarn add @bobbyquantum/ngx-editor

Usage

Import NgxEditorComponent and initialize the editor

app.component.ts

import { NgxEditorComponent, Editor } from '@bobbyquantum/ngx-editor';

@Component({
  selector: 'app-component',
  templateUrl: 'app.component.html',
  styleUrls: ['app.component.scss'],
  standalone: true,
  imports: [NgxEditorComponent],
})
export class AppComponent implements OnInit, OnDestroy {
  html = 'Hello world!';
  editor: Editor;
  ngOnInit(): void {
    this.editor = new Editor();
  }

  ngOnDestroy(): void {
    this.editor.destroy();
  }
}

Then in HTML

app.component.html

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

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

Live Demo

Angular 21 (WebContainer)

This demo uses StackBlitz WebContainer mode, which is required for Angular 21. It is based on the official Angular 21 StackBlitz starter.

Angular 16 (Legacy)

The following demo is of the original component pre-fork and remains available for reference: