jodit / jodit-angular

Angular wrapper for Jodit && Hey. Due to the fact that I do not use Angular in my projects, I cannot fix plugin errors in a timely manner. If you want the plugin to develop, send PR or better become a contributor
MIT License
48 stars 35 forks source link

Databinding the editor's value #14

Closed ddhille closed 3 years ago

ddhille commented 6 years ago

I'm wondering how the proper way to access the editor's value would look like. It's somehow missing in the readme. I'm currently using Jodit in my Ionic 3 app.

.html

<jodit-editor #editor
    (onChange)="editorValueChanged(editor)"
    [config]="{
        uploader: { insertImageAsBase64URI: 'true' },
        buttons: 'bold,strikethrough,underline,italic,|,superscript,subscript,|,ul,ol,hr,paragraph,|,image,video,table,link,|,undo,redo,|,print',
        language: 'de'}">
</jodit-editor>

.ts

editorValueChanged(editor) {
  editor.value = "somefunnytext"
}

This code is working. As soon as I type in some text in the editor, it gets replaced by "somefunnytet"... BUT I naturally want my editor to let me set its value as soon as the page is loading. And not after I typed in some text (onChange).

I'm pretty new to Angular and Ionic, so I might just lack some basic knowledge of how this is done properly.

helix46 commented 6 years ago

I'm not using Ionic, but this works for me:

<form [formGroup]="myForm">

myForm: FormGroup; constructor(@Inject(FormBuilder) private builder: FormBuilder) { this.myForm = this.builder.group({ myJodit: new FormControl('') }); }

this.myForm.controls.myJodit.setValue(value);

let value: string = this.myForm.controls.myJodit.value;

More info here: https://angular.io/guide/reactive-forms