@82editor/angular

Angular (17+) standalone component for 82editor, the free (MIT) WYSIWYG HTML editor for Korean sites. Works with ngModel and reactive forms (ControlValueAccessor).

npm i @82editor/core @82editor/angular

import { Component } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { Editor82Component } from '@82editor/angular';

@Component({
  selector: 'app-write',
  standalone: true,
  imports: [FormsModule, Editor82Component],
  template: `<editor-82 [(ngModel)]="html" [options]="{ height: 400 }" (ready)="onReady($event)"></editor-82>`,
})
export class WriteComponent {
  html = '<p>안녕하세요</p>';
  onReady(editor: import('@82editor/core').Editor) { editor.focus(); }
}

Add the stylesheet once (e.g. in angular.json styles): node_modules/@82editor/core/dist/styles.css.

Inputs: options (read once), value (with (valueChange) for [(value)]), readOnly, theme. Outputs: valueChange, ready, focused, blurred. formControlName="body" and [disabled] work through the forms API.

Docs: https://82editor.com/docs/angular/

License

MIT © 2nd Korea (세컨드코리아)