ngx-editor
Advanced tools
The Rich Text Editor for Angular, Built on ProseMirror
A simple rich text editor for angular applications built with ProseMirror. It is a drop in and easy-to-use editor and can be easily extended using prosemirror plugins to build any additional or missing features
demo | edit on stackblitz | documentation | migrating from other editors
Install via Package managers such as npm or pnpm or yarn
npm install ngx-editor
# or
pnpm install ngx-editor
# or
yarn add ngx-editor
Note: By default the editor comes with minimal features. Refer the demo and documentation for more details and examples.
Import ngx-editor module
import { NgxEditorModule } from 'ngx-editor';
@NgModule({
imports: [NgxEditorModule],
})
export class AppModule {}
Component
import { Editor } from 'ngx-editor';
export class EditorComponent implements OnInit, OnDestroy {
editor: Editor;
html = '';
ngOnInit(): void {
this.editor = new Editor();
}
// make sure to destory the 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>
Note: Input can be a HTML string or a jsonDoc
Mostly works on all Evergreen-Browsers like
See https://sibiraj-s.github.io/ngx-editor/#/collab
Icons are from https://fonts.google.com/icons
All contributions are welcome. See CONTRIBUTING.md to get started.
FAQs
The Rich Text Editor for Angular, Built on ProseMirror
The npm package ngx-editor receives a total of 40,229 weekly downloads. As such, ngx-editor popularity was classified as popular.
We found that ngx-editor demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 0 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Research
An advanced npm supply chain attack is leveraging Ethereum smart contracts for decentralized, persistent malware control, evading traditional defenses.
Security News
Research
Attackers are impersonating Sindre Sorhus on npm with a fake 'chalk-node' package containing a malicious backdoor to compromise developers' projects.
Security News
The npm package for the LottieFiles Player web component was hit with a supply chain attack after a software engineer's npmjs credentials were compromised.