How to Enable a Tiny MCE Plugin?

Question

So I've never used tinymce before and I'm working on a project in which it has already been installed. I copied the code from the docs here:

tinymce.init({
  selector: "textarea", // change this value according to your HTML
  plugins: "advlist"
});

But I have no clue where this init function needs to go in order to be called.

Tiny is simply being used to have an email text editor and the line that calls on tinymce (I think) is this:

<app-tinymce formControlName='emailBody'></app-tinymce>

Thanks!

Answer 1

After tinymce library and html is loaded (insert this after <script src={tinymcelib}></script> ) you should call

<script>
  tinymce.init({
    selector: "html node to mount editor.
    plugins: "list of plugins to use"
  });
</script>

eg. to mount editor to element <textarea id="editor"> with plugin advlist, you would call it like that:

<script>
  tinymce.init({
    selector: "#editor"
    plugins: "advlist"
  });
</script>

Answer 2

You will also want to reference the TinyMCE Angular docs, you are using the init function that is more for a vanilla HTML/JS approach. Not knowing the exact set up it's hard to say what's going on, but here's the link to the Tiny Angular docs: https://www.tiny.cloud/docs/integrations/angular2/

And here's the link to the Tiny Angular wrapper on GitHiub: https://github.com/angular-ui/ui-tinymce

Hopefully that helps, sounds like a tough situation!