Top

Editors


Installation

npm install ngx-editor

ngx-editor.component.html

<ngx-editor [editor]="editor" [ngModel]="html" [disabled]="false" [placeholder]="'Type here...'"></ngx-editor>

ngx-editor.component.ts

import { CommonModule } from '@angular/common';
import { Component } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { Editor, NgxEditorModule } from 'ngx-editor';

@Component({
  selector: 'app-ngx-editor',
  standalone: true,
  imports: [CommonModule, FormsModule, NgxEditorModule],
  templateUrl: './ngx-editor.component.html',
  styleUrl: './ngx-editor.component.scss'
})

export class NgxEditorComponent {

  public editor: Editor;
  public html = '';

  ngOnInit(): void {
    this.editor = new Editor();
  }
  
  ngOnDestroy(): void {
    this.editor.destroy();
  }
}

Uninstalling Package

npm uninstall ngx-editor

Installation

npm i @kolkov/angular-editor

mde-editor.component.html

<angular-editor [placeholder]="'Enter text here...'" [(ngModel)]="htmlContent"></angular-editor>

mde-editor.component.ts

import { CommonModule } from '@angular/common';
import { Component } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { AngularEditorModule } from '@kolkov/angular-editor';

@Component({
  selector: 'app-mde-editor',
  standalone: true,
  imports: [CommonModule, AngularEditorModule, FormsModule],
  templateUrl: './mde-editor.component.html',
  styleUrl: './mde-editor.component.scss'
})

export class MdeEditorComponent {

  public htmlContent = '';

  constructor() { }
    ngOnInit(): void {
  }
}

Uninstalling Package

npm uninstall @kolkov/angular-editor