Angular-editable NPM

Angular Editable

Angular wysiwyg Rich Text Editor

Demo

click here to go to demo page

Installation

npm i angular-editable

Usage

Import AngularEditableModule into your app module
Add AngularEditableModule to imports

import { AngularEditableModule } from 'angular-editable'

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    AngularEditableModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

add <angular-editable></angular-editable> to your html component

Events

Event	Description
focus	editor focus in
blur	editor focus out
change	editor changing event will return html result

Configuration

to change angular-editable configuration import AngularEditableConfig to your component
apply changes inside constructor()
Example:

import { AngularEditableConfig } from 'angular-editable'

export class AppComponent {
  constructor(){
    AngularEditableConfig.style = {primary: '#D9D0DE', secondary: '#F52F57', toolbarColor: '#BC8DA0', light: '#D9D0DE', dark1: '#0C1713', dark2: '#A04668', dark3: '#AB4967'}
    AngularEditableConfig.translate = {/* Your translation */}
  }
}