Package Exports
- @bobbyquantum/ngx-editor
- @bobbyquantum/ngx-editor/commands
- @bobbyquantum/ngx-editor/helpers
- @bobbyquantum/ngx-editor/input-rules
- @bobbyquantum/ngx-editor/package.json
- @bobbyquantum/ngx-editor/schema
- @bobbyquantum/ngx-editor/utils
Readme
@bobbyquantum/ngx-editor
The Rich Text Editor for Angular 21+ (Zoneless), Built on ProseMirror
⚠️ This is a fork of sibiraj-s/ngx-editor
The original project appears to be inactive. This fork has been updated to support Angular 21 with zoneless change detection and modern Angular patterns. It is published under a scoped npm package for independent distribution.
What's Different
- ✅ Angular 21 support
- ✅ Zoneless change detection (
provideZonelessChangeDetection()) - ✅ OnPush change detection for all components
- ✅ Angular Signals for reactive state
- ✅ Modern control flow (
@if,@forinstead of*ngIf,*ngFor) - ✅
inject()pattern instead of constructor injection - ✅ Ctrl/Cmd+Click to open links in editor
Getting Started
Installation
npm install @bobbyquantum/ngx-editorUsage
Note: By default the editor comes with minimal features.
import {
NgxEditorComponent,
NgxEditorMenuComponent,
Editor,
} from '@bobbyquantum/ngx-editor';
import { FormsModule } from '@angular/forms';
@Component({
selector: 'editor-component',
templateUrl: 'editor.component.html',
styleUrls: ['editor.component.scss'],
standalone: true,
imports: [NgxEditorComponent, NgxEditorMenuComponent, FormsModule],
})
export class MyEditorComponent implements OnInit, OnDestroy {
html = '';
editor: Editor;
ngOnInit(): void {
this.editor = new Editor();
}
ngOnDestroy(): void {
this.editor.destroy();
}
}Then in HTML
<div class="NgxEditor__Wrapper">
<ngx-editor-menu [editor]="editor"></ngx-editor-menu>
<ngx-editor
[editor]="editor"
[ngModel]="html"
[disabled]="false"
[placeholder]="'Type here...'"
></ngx-editor>
</div>Zoneless Setup
In your app config:
import { provideZonelessChangeDetection } from '@angular/core';
export const appConfig: ApplicationConfig = {
providers: [provideZonelessChangeDetection()],
};Browser Compatibility
Works on all Evergreen browsers:
- Google Chrome
- Microsoft Edge
- Mozilla Firefox
- Safari
- Opera
Icons
Icons are from https://fonts.google.com/icons
Original Project
This is a fork of sibiraj-s/ngx-editor. Full credit to the original author for the excellent foundation.
License
MIT - See LICENSE