### File

`packages/components/externals/quill/quill-editor.component.ts`

### Implements

`AfterViewInit` `ControlValueAccessor` `OnChanges` `OnDestroy` `Validator`

### Metadata

encapsulation | `ViewEncapsulation.None`
providers | `{ multi: true, provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => QuillEditorComponent), }` `{ multi: true, provide: NG_VALIDATORS, useExisting: forwardRef(() => QuillEditorComponent), }`
selector | `quill-editor`
template |
    <ng-content select="[quill-editor-toolbar]" />

### Index

###### Properties
content editorElem quillEditor selectionChangeHandler textChangeHandler
###### Methods
onModelChange onModelTouched registerOnChange registerOnTouched setDisabledState validate writeValue
###### Inputs
bounds customOptions customToolbarPosition debug format formats hasImageFeature id maxLength minLength modules placeholder preserveWhitespace readOnly required sanitize scrollingContainer strict styles theme trackChanges valueGetter valueSetter
###### Outputs
onBlur onContentChanged onEditorCreated onFocus onSelectionChanged

### Inputs

bounds
Type : `HTMLElement | string`

customOptions
Type : `CustomOption[]`
Default value : `[]`

customToolbarPosition
Type : `"top" | "bottom"`
Default value : `'top'`

debug
Type : `"warn" | "log" | "error" |`

format
Type : `"object" | "html" | "text" | "json"`

formats
Type : `string[] | null`

hasImageFeature
Type : `boolean`

id
Type : `string`

maxLength
Type : `number`

minLength
Type : `number`

modules
Type : `QuillModules`

placeholder
Type : `string`

preserveWhitespace
Type : `boolean`
Default value : `false`

readOnly
Type : `boolean`

required
Type : `boolean`
Default value : `false`

sanitize
Type : `boolean`
Default value : `false`

scrollingContainer
Type : `HTMLElement | string | null`

strict
Type : `boolean`
Default value : `true`

styles
Type : `any`
Default value : `null`

theme
Type : `string`

trackChanges
Type : `"user" | "all"`

valueGetter
Type : `(quillEditor: any, editorElement: HTMLElement) => any`
Default value : `(quillEditor: any, editorElement: HTMLElement): string | any => { let html: string | null = editorElement.querySelector('.ql-editor')?.innerHTML; if (html === '<p><br></p>' || html === '<div><br><div>') { html = null; } let modelValue = html; const format = getFormat(this.format, this.config.format); if (format === 'text') { modelValue = quillEditor.getText(); } else if (format === 'object') { modelValue = quillEditor.getContents(); } else if (format === 'json') { try { modelValue = JSON.stringify(quillEditor.getContents()); } catch (e) { modelValue = quillEditor.getText(); } } return modelValue; }`

valueSetter
Type : `(quillEditor: any, value: any) => any`
Default value : `(quillEditor: any, value: any): any => { const format = getFormat(this.format, this.config.format); if (format === 'html') { if (this.sanitize) { value = this.domSanitizer.sanitize(SecurityContext.HTML, value); } return quillEditor.clipboard.convert({ html: value }); } else if (format === 'json') { try { return JSON.parse(value); } catch (e) { return [{ insert: value }]; } } return value; }`

### Outputs

onBlur
Type : `EventEmitter<literal type>`

onContentChanged
Type : `EventEmitter<ContentChange>`

onEditorCreated
Type : `EventEmitter<any>`

onFocus
Type : `EventEmitter<literal type>`

onSelectionChanged
Type : `EventEmitter<SelectionChange>`

### Methods

onModelChange
`onModelChange(_modelValue?: any)`
Parameters :
Name | Type | Optional
_modelValue | `any` | Yes
Returns : `void`

onModelTouched
`onModelTouched()`
Returns : `void`

registerOnChange
`registerOnChange(fn: (modelValue: any) => void)`
Parameters :
Name | Type | Optional
fn | `function` | No
Returns : `void`

registerOnTouched
`registerOnTouched(fn: () => void)`
Parameters :
Name | Type | Optional
fn | `function` | No
Returns : `void`

setDisabledState
`setDisabledState(isDisabled: boolean)`
Parameters :
Name | Type | Optional | Default value
isDisabled | `boolean` | No | `this.disabled`
Returns : `void`

validate
`validate()`
Returns : `any`

writeValue
`writeValue(currentValue: any)`
Parameters :
Name | Type | Optional
currentValue | `any` | No
Returns : `void`

### Properties

content
Type : `any`

editorElem
Type : `HTMLElement | undefined`

quillEditor
Type : `any`

selectionChangeHandler
Default value : `() => {...}`

textChangeHandler
Default value : `() => {...}`

# results matching ""

# No results matching ""