surmon-china / Ngx Quill Editor
Licence: mit
π‘@quilljs editor component for @angular
Stars: β 234
Programming Languages
typescript
32286 projects
Projects that are alternatives of or similar to Ngx Quill Editor
Angular Prest
pREST component for Angular
Stars: β 16 (-93.16%)
Mutual labels: angular-components, angular-directives, angularjs, angular4
angular2-cookie-law
Angular2+ component that provides a banner to inform users about cookie law
Stars: β 38 (-83.76%)
Mutual labels: angularjs, ng2, angular4, angular-components
quill-markdown-toolbar
A Quill.js module for converting markdown text to rich text format
Stars: β 13 (-94.44%)
Mutual labels: quill, text-editor, quilljs
Angular4-seed
Angular 4 Seed for Angular Forms
Stars: β 37 (-84.19%)
Mutual labels: angularjs, angular4, angular-components
Angular-Firebase-Sortable-Table
Angular Firebase Sortable Table is a module that makes tables creation with firebase an easy task.
Stars: β 28 (-88.03%)
Mutual labels: angularjs, angular4, angular-components
Angular Admin
πAdmin client for surmon.me blog powered by @angular and Bootstrap4
Stars: β 352 (+50.43%)
Mutual labels: angular-components, ng2, angular4
Vue Quill Editor
π‘@quilljs editor component for @vuejs
Stars: β 6,874 (+2837.61%)
Mutual labels: text-editor, quill, quilljs
Ngautocomplete
Light-weight autocomplete component for Angular.
Stars: β 52 (-77.78%)
Mutual labels: ng2, angularjs, angular4
Ngx Quill Example
demo app for the advanced usage of ngx-quill module
Stars: β 137 (-41.45%)
Mutual labels: quill, quilljs
Ng2 Search Filter
Angular 2 / Angular 4 / Angular 5 custom pipe npm module to make a search filter on any input, π₯ 100K+ downloads
Stars: β 137 (-41.45%)
Mutual labels: ng2, angular4
Material
A lightweight Material Design library for Angular based on Google's Material Components for the Web.
Stars: β 143 (-38.89%)
Mutual labels: angular-components, angular-directives
Coreui Free Bootstrap Admin Template
CoreUI is free bootstrap admin template
Stars: β 11,038 (+4617.09%)
Mutual labels: angularjs, angular4
Fusebox Angular Universal Starter
Angular Universal seed project featuring Server-Side Rendering, @fuse-box bundling, material, firebase, Jest, Nightmare, and more
Stars: β 132 (-43.59%)
Mutual labels: angularjs, angular4
Learn Angular From Scratch Step By Step
Angular step by step tutorial covering from basic concepts of Angular Framework to building a complete Angular app using Angular Material components. We will go through the main building blocks of an Angular 7 application as well as the best practices for building a complete app with Angular.
Stars: β 140 (-40.17%)
Mutual labels: angular-components, angular4
Ng2 Smart Table
Angular Smart Data Table component
Stars: β 1,590 (+579.49%)
Mutual labels: ng2, angular4
Angular Google Maps
Angular 2+ Google Maps Components
Stars: β 1,982 (+747.01%)
Mutual labels: ng2, angular4
Quill Better Table
Module for better table in Quill, more useful features are supported.
Stars: β 175 (-25.21%)
Mutual labels: quill, quilljs
Ng Simple Slideshow
A simple, responsive slideshow for Angular 4+.
Stars: β 119 (-49.15%)
Mutual labels: angular-components, angular4
Angular Promise Buttons
Chilled loading buttons for AngularJS
Stars: β 156 (-33.33%)
Mutual labels: angular-directives, angularjs
Ng Quill
AngularJS Component for Quill rich text editor
Stars: β 223 (-4.7%)
Mutual labels: quilljs, angularjs
THIS PROJECT IS DEPRECATED
β Component is not maintained anymore.
β Please consider using ngx-quill.
ngx-quill-editor
Quill editor for AngularX.
εΊδΊ Quillγιη¨δΊ AngularX ηε―ζζ¬ηΌθΎε¨γ
Example
Installation
npm install ngx-quill-editor --save
Sample
Include QuillEditorModule in your main module:
import { QuillEditorModule } from 'ngx-quill-editor';
@NgModule({
// ...
imports: [
QuillEditorModule
],
// ...
})
export class AppModule {}
Then use it in your component:
<!-- use with ngModel -->
<quill-editor
[(ngModel)]="editorContent"
[options]="editorOptions"
(blur)="onEditorBlured($event)"
(focus)="onEditorFocused($event)"
(ready)="onEditorCreated($event)"
(change)="onContentChanged($event)"
></quill-editor>
<!-- or use with formControl -->
<quill-editor
class="form-control"
[formControl]="editorContent"
[options]="editorOptions"
(blur)="onEditorBlured($event)"
(focus)="onEditorFocused($event)"
(ready)="onEditorCreated($event)"
(change)="onContentChanged($event)"
></quill-editor>
import { Component } from '@angular/core';
@Component({
selector: 'sample',
template: require('./sample.html')
})
export class Sample {
public editor;
public editorContent = `<h3>I am Example content</h3>`;
public editorOptions = {
placeholder: "insert content..."
};
constructor() {}
onEditorBlured(quill) {
console.log('editor blur!', quill);
}
onEditorFocused(quill) {
console.log('editor focus!', quill);
}
onEditorCreated(quill) {
this.editor = quill;
console.log('quill is ready! this is current quill instance object', quill);
}
onContentChanged({ quill, html, text }) {
console.log('quill content is changed!', quill, html, text);
}
ngOnInit() {
setTimeout(() => {
this.editorContent = '<h1>content changed!</h1>';
console.log('you can use the quill instance object to do something', this.editor);
// this.editor.disable();
}, 2800)
}
}
Configuration
- options : The configuration object for quill see https://quilljs.com/docs/quickstart/
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].