From 36133e1c2e5ace9e1fe6b5c08bebb5746f80bf01 Mon Sep 17 00:00:00 2001 From: Sibiraj Date: Sun, 11 Mar 2018 22:03:09 +0530 Subject: [PATCH] fix: don't return values from writeValue closes #78 --- docs/components/NgxEditorComponent.html | 200 +++++++++--------- .../components/NgxEditorToolbarComponent.html | 2 +- docs/components/NgxGrippieComponent.html | 2 +- docs/injectables/CommandExecutorService.html | 39 +--- docs/js/search/search_index.js | 4 +- src/app/ngx-editor/ngx-editor.component.ts | 17 +- 6 files changed, 126 insertions(+), 138 deletions(-) diff --git a/docs/components/NgxEditorComponent.html b/docs/components/NgxEditorComponent.html index 4a466f7a..7980d5e8 100644 --- a/docs/components/NgxEditorComponent.html +++ b/docs/components/NgxEditorComponent.html @@ -513,9 +513,6 @@
Methods
  • getCollectiveParams
  • -
  • - monitorEditor -
  • onContentChange
  • @@ -543,6 +540,9 @@
    Methods
  • toggleCodeEditor
  • +
  • + togglePlaceholder +
  • writeValue
  • @@ -648,7 +648,7 @@

    Constructor

    -
    Defined in src/app/ngx-editor/ngx-editor.component.ts:96
    +
    Defined in src/app/ngx-editor/ngx-editor.component.ts:95
    @@ -1145,7 +1145,7 @@

    HostListeners

    @@ -1180,7 +1180,7 @@

    @@ -1256,7 +1256,7 @@

    @@ -1273,77 +1273,6 @@

    - +
    - +
    - +
    - - - - - - - - - - - - - - - - - - -
    - - - - monitorEditor - - - -
    - monitorEditor(value: any) -
    - -
    -

    monitor text area changes

    -
    - -
    - Parameters : - - - - - - - - - - - - - - - - - - - -
    NameTypeOptional
    value - any - - no -
    -
    -
    -
    -
    - Returns : void - -
    -
    - -
    -
    @@ -1366,7 +1295,7 @@

    @@ -1442,7 +1371,7 @@

    @@ -1481,7 +1410,7 @@

    @@ -1518,7 +1447,7 @@

    @@ -1787,7 +1716,7 @@

    @@ -1863,7 +1792,7 @@

    @@ -1880,6 +1809,82 @@

    - +
    - +
    - +
    - +
    - +
    - +
    + + + + + + + + + + + + + + + + + + +
    + + + + togglePlaceholder + + + +
    + togglePlaceholder(value: any) +
    + +
    +

    toggles placeholder based on input string

    +
    + +
    + Parameters : + + + + + + + + + + + + + + + + + + + + + +
    NameTypeOptionalDescription
    value + any + + no + +

    A HTML string from the editor

    +
    +
    +
    +
    +
    +
    + Returns : void + +
    +
    + +
    +
    @@ -1902,7 +1907,7 @@

    @@ -2250,7 +2255,6 @@

    Utils: any = Utils; codeEditorMode = false; - private lastViewModel: any = ''; private ngxCodeMirror: any = undefined; private onChange: (value: string) => void; private onTouched: () => void; @@ -2294,7 +2298,7 @@

    if (typeof this.onChange === 'function') { this.onChange(html); - this.monitorEditor(html); + this.togglePlaceholder(html); } return; @@ -2359,10 +2363,11 @@

    * @param value value to be executed when there is a change in contenteditable */ writeValue(value: any): void { - this.monitorEditor(value); - if (value === null || value === undefined || value === '') { - return; + this.togglePlaceholder(value); + + if (value === null || value === undefined || value === '' || value === '<br>') { + value = null; } this.refreshView(value); @@ -2394,12 +2399,11 @@

    * @param value html string from the editor */ refreshView(value: string): void { - const normalizedValue = value == null ? '' : value; + const normalizedValue = value === null ? '' : value; this._renderer.setProperty(this.textArea.nativeElement, 'innerHTML', normalizedValue); return; } - /** * toggle between codeview and editor */ @@ -2409,7 +2413,6 @@

    if (this.codeEditorMode) { this.ngxCodeMirror = CodeMirror.fromTextArea(this.codeEditor.nativeElement, codeMirrorConfig); - this._renderer.setStyle(this.textArea.nativeElement, 'display', 'none'); /** set value of the code editor */ this.ngxCodeMirror.setValue(this.textArea.nativeElement.innerHTML); @@ -2421,7 +2424,6 @@

    /** remove/ destroy code editor */ this.ngxCodeMirror.toTextArea(); - this._renderer.setStyle(this.textArea.nativeElement, 'display', 'block'); /** update the model value and html content on the contenteditable */ this.refreshView(this.ngxCodeMirror.getValue()); @@ -2432,9 +2434,11 @@

    } /** - * monitor text area changes + * toggles placeholder based on input string + * + * @param value A HTML string from the editor */ - monitorEditor(value: any): void { + togglePlaceholder(value: any): void { if (!value || value === '<br>' || value === '') { this._renderer.addClass(this.ngxWrapper.nativeElement, 'show-placeholder'); } else { @@ -2486,7 +2490,7 @@

    <app-ngx-editor-toolbar [config]="config" (execute)="executeCommand($event)"></app-ngx-editor-toolbar> <!-- text area --> - <div class="ngx-wrapper" #ngxWrapper> + <div class="ngx-wrapper" [hidden]="codeEditorMode" #ngxWrapper> <div class="ngx-editor-textarea" [attr.contenteditable]="config['editable']" (input)="onContentChange($event.target.innerHTML)" [attr.translate]="config['translate']" [attr.spellcheck]="config['spellcheck']" [style.height]="config['height']" [style.minHeight]="config['minHeight']" [style.resize]="Utils?.canResize(resizer)" (focus)="onTextAreaFocus()" (blur)="onTextAreaBlur()" #ngxTextArea></div> @@ -2526,7 +2530,7 @@

    - +