how to access TinyMCE in controller to dynamically change the height etc

[aqkhana2002]

is there a way we can access TinyMCE in component ? like i want to change the height property or say i wanna change context menu item.

[exalate-issue-sync[bot]]

Ref: INT-2637

[tiny-james]

EDIT: I thought this was a react case so this is not all correct for angular, sorry!

is there a way we can access TinyMCE in component

Yes. All the event handlers return the tinymce instance as the second argument.

const editorRef = useRef();

return (
  <>
    <Editor onInit={(evt, editor) => editorRef.current = editor}/>
    <button onClick={() => editorRef.current && console.log(editorRef.current.getContent())}>Log content</button>
  </>
);

https://codesandbox.io/s/tinymce-react-editor-by-event-handler-1nek3

The editor instance is also available on the class so you can just get the editor by using the ref prop directly, though you need to check it's initialized before using it.

const componentRef =useRef();
return (
  <>
    <Editor ref={componentRef}/>
    <button onClick={() => componentRef.current && componentRef.current.editor && componentRef.current.editor.initialized && console.log(componentRef.current.editor.getContent())}>Log content</button>
  </>
);

https://codesandbox.io/s/tinymce-react-editor-by-component-ref-cydrt

---

i want to change the height property

The height property of tinymce can't be changed after initialization, however you can set it to 100% of the container it is in and then change the height of the container.

https://codesandbox.io/s/tinymce-react-resize-with-code-ogjp9

i wanna change context menu item

Context menu items are already dynamic. If you can be more specific I can possibly point you in the right direction.

[jscasca]

@aqkhana2002 Sorry, I thought this had been answered. You can access the editor via the editor getter editor. For example:

@ViewChild(EditorComponent) editorView;
...
console.log(this.editorView.editor);

Or you can create a local reference via the editor setup function. For example:

editorRef;
  conf = {
    setup: (e) => {
      this.editorRef = e;
    }
  };
...
console.log(this.editorRef);

The previous answer should answer your other questions.