https://github.com/techyaura/ngx-quilljs

An Angular specific rich text editor using Quill Js
https://github.com/techyaura/ngx-quilljs

angular library quilljs rich-text-editor wysiwyg

Last synced: 5 months ago
JSON representation

An Angular specific rich text editor using Quill Js

• Host: GitHub
• URL: https://github.com/techyaura/ngx-quilljs
• Owner: techyaura
• Created: 2020-04-19T08:43:38.000Z (about 6 years ago)
• Default Branch: master
• Last Pushed: 2022-06-03T02:27:44.000Z (about 4 years ago)
• Last Synced: 2025-10-13T07:49:24.317Z (8 months ago)
• Topics: angular, library, quilljs, rich-text-editor, wysiwyg
• Language: CSS
• Homepage: https://ngx-quilljs.stackblitz.io/
• Size: 618 KB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 3
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# ngx-quilljs

An Angular specific rich text editor using Quill Js

## Install

`npm i ngx-quilljs`

## use

Use Module

```...

imports: [

    QuilljsModule

],

```

Then, use component

```

```

## Editor OPTIONS

```

Options = {

  theme: , // Defaults to 'snow'

  placeholder: '', 

  toolbar:  // Defaults to all the tools available for Quill Editor,

  height: '' // defaults to 100px

};

```

``

```

'snow' OR 'bubble'

```

SNOW

[![default.png](https://i.postimg.cc/Wb67Fmkr/default.png)](https://postimg.cc/7fhzj2XY)

Bubble

[![bubble.png](https://i.postimg.cc/sgj4pBYL/bubble.png)](https://postimg.cc/hfYmnt38)

``

```

[

	['bold', 'italic', 'underline', 'strike', 'image'],  // toggled buttons

	['blockquote', 'code-block'],

	[{ header: 1 }, { header: 2 }],                      // custom button values

	[{ list: 'ordered'}, { list: 'bullet' }],

	[{ script: 'sub'}, { script: 'super' }],             // superscript/subscript

	[{ indent: '-1'}, { indent: '+1' }],                 // outdent/indent

	[{ direction: 'rtl' }],                              // text direction

	[{ size: ['small', false, 'large', 'huge'] }],       // custom dropdown

	[{ header: [1, 2, 3, 4, 5, 6, false] }],

	[{ color: [] }, { background: [] }],                 // dropdown with defaults from theme

	[{ font: [] }],

	[{ align: [] }],

	['clean']                                            // remove formatting button

]

```

## RELEASE [ v0.0.9 ] - Fixes

-  Fixed image display issue. Now the content instantly sync as the user type