Angular 13 Tinymce 6 add external plugin MathType

Question

I have an Angular application and I am using TinyMCE as my editor. And I want add external plugin to TinyMCE MathType. But I can't understand how can I add this plugin and to use?

When I use this code:

export class PageComponent {
  tinymceConfig = {};
  constructor(private request: RequestService) {
    this.tinymceConfig = {
      external_plugins: {
        'tiny_mce_wiris': 'node_modules/@wiris/mathtype-tinymce6/plugin.min.js',
      },
      toolbar: 'tiny_mce_wiris_formulaEditor tiny_mce_wiris_formulaEditorChemistry',
      draggable_modal: true,
      extended_valid_elements: '*[.*]',
      plugins: 'lists link image table code help wordcount tiny_mce_wiris',
      language: 'ru',
    };
  }

  async testEvent() {
    await this.request.postRequest(`${environment.apiUrl}/api/auth/account/islogging`, []);
  }
}

<editor
      [init]="tinymceConfig"
></editor>

And this error: Failed to load plugin: tiny_mce_wiris from url node_modules/@wiris/mathtype-tinymce6/plugin.min.js

score 0 · Answer 1 · answered Jul 03 '23 at 13:06

You have to use this url: https://www.wiris.net/demo/plugins/tiny_mce/plugin.js

instead of: node_modules/@wiris/mathtype-tinymce6/plugin.min.js

About it you can check this guide: https://docs.wiris.com/mathtype/en/mathtype-integrations/mathtype-web-interface-features/external-integration.html

Angular 13 Tinymce 6 add external plugin MathType

1 Answers1