15.0.9 • Published 1 year ago

@ngodings/ngx-editor v15.0.9

Weekly downloads
-
License
MIT
Repository
github
Last release
1 year ago

@ngodings/ngx-editor

Angular package for Editor, easy to use (Support Mention & Tagging) from ckeditor5

Demo - Angular v15

https://npm.ngodings.com/packages/ngx-editor

Support Me

If you like this package I will be happy that you support me on Buy me a coffee :) Buy me coffee: https://www.buymeacoffee.com/alidihaw Indonesia People: https://sociabuzz.com/dihaw

Getting Started

Installing and Importing

Install the package by command:

 npm install @ngodings/ngx-editor --save

Import the module

import { NgxEditorModule } from "@ngodings/ngx-editor";

@NgModule({
    imports: [
        ...
        NgxEditorModule
    ],
    declarations: [...],
    providers: [...]
})
export class AppModule {}

Set types editor - inside src folder - create file types.d.ts

declare module '@ngodings/ckeditor5' {
    const ClassicEditorBuild: any;

    export default ClassicEditorBuild;
}

Usage

Editor (Support Tagging # & Mention @)

<ngx-editor [(data)]="text" [tags]="tags" [mentions]="mentions"></ngx-editor>

Editor Simple

<ngx-editor [(data)]="text" [tags]="tags" [mentions]="mentions" [isSimple]="true"></ngx-editor>

Option (Input & Output)

namedescriptiondefault value
datatext data
tagsData tags trigger by @[]
mentionsData mentions trigger by @[]
isSimpleSimple Toolbarfalse
dataChangeCallback text data

Editor View Result

<ngx-view-editor [data]="text"></ngx-view-editor>

Option (Input & Output)

namedescriptiondefault value
datatext data
customClassCustom view inner html

Development

Prepare your environment

  • Install Node.js and NPM
  • Install local dev dependencies: npm install while current directory is this repo

License

MIT @ Ali Abdul Wahid