Get the edited content in tinyMCE 6

Question

I am integrating TinyMCE in my ember.js app. Unfortunately I cannot get back the edited content, or at least, all of it.

    tinymce.init({
      selector: '#'+ this.editorId,
      toolbar: 'undo redo | alignleft aligncenter alignright alignjustify | ' ,
      menubar: false,
      setup: (editor) => {
        editor.on('input', (e) => {
          console.log(e);
        });
      }
    });

the input event is fired every time the content is modified. e contain at best, the last div in the editor and never the whole content in e.rangeParent.textContent.

Is there a way to get back all of the content edited by TinyMCE?

Answer 1

I managed to find a way to do it, I changed the method to initialize tinyMCE from selector to target but it should be easy to use for both method.

  const editors= await tinymce.init({
    target: element //the textarea DOM element
  })
  editors[0].on('input',() => {
    setValue(editors[0].getContent())
  })

It may be a little overkill but I have a case where I want to show live the changes in 2 previews at once.