Package Exports
- @kolkov/angular-editor
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@kolkov/angular-editor) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
AngularEditor
A simple native wysiwyg editor for Angular 6+, 7+
Demo
Demo is here demo
Working code for this demo at stackblitz example
Getting Started
Installation
Install via npm package manager
npm install @kolkov/angular-editor --saveUsage
Import angular-editor module
import { HttpClientModule} from '@angular/common/http';
import { AngularEditorModule } from '@kolkov/angular-editor';
@NgModule({
imports: [ HttpClientModule, AngularEditorModule ]
})Then in HTML
<angular-editor [placeholder]="'Enter text here...'" [(ngModel)]="htmlContent"></angular-editor>or for usage with reactive forms
<angular-editor formControlName="htmlContent" [config]="editorConfig"></angular-editor>if you using more than one editor on same page set id property
<angular-editor id="editor1" formControlName="htmlContent1" [config]="editorConfig"></angular-editor>
<angular-editor id="editor2" formControlName="htmlContent2" [config]="editorConfig"></angular-editor>
where
import { AngularEditorConfig } from '@kolkov/angular-editor';
...
editorConfig: AngularEditorConfig = {
editable: true,
spellcheck: true,
height: '25rem',
minHeight: '5rem',
placeholder: 'Enter text here...',
translate: 'no',
uploadUrl: 'v1/images', // if needed
customClasses: [ // optional
{
name: "quote",
class: "quote",
},
{
name: 'redText',
class: 'redText'
},
{
name: "titleText",
class: "titleText",
tag: "h1",
},
]
};For ngModel to work, you must import FormsModule from @angular/forms, or for formControlName, you must import ReactiveFormsModule from @angular/forms