import { Component } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { TinymceComponent } from 'ngx-tinymce'; @Component({ selector: 'my-app', template: ` `, imports: [FormsModule, TinymceComponent], }) export class AppComponent { html = `

TinyMCE Logo

Welcome to the TinyMCE Cloud demo!

Note, this includes some "enterprise/premium" features.
Visit the pricing page to learn more about our premium plugins.

Please try out the features provided in this full featured example.

Got questions or need help?

Our documentation is a great resource for learning how to configure TinyMCE.
Have a specific question? Visit the Community Forum.
We also offer enterprise grade support as part of TinyMCE premium subscriptions.

A simple table to play with

Product	Cost	Really?
TinyMCE Cloud	Get started for free	YES!
Plupload	Free	YES!

Found a bug?

If you think you have found a bug please create an issue on the GitHub repo to report it to the developers.

Finally ...

Don't forget to check out our other product Plupload, your ultimate upload solution featuring HTML5 upload support.

Thanks for supporting TinyMCE! We hope it helps you and your users create great content.
All the best from the TinyMCE team.

`; config: any = { height: 250, // theme: "modern", // powerpaste advcode toc tinymcespellchecker a11ychecker mediaembed linkchecker help plugins: 'print preview fullpage searchreplace autolink directionality visualblocks visualchars fullscreen image imagetools link media template codesample table charmap hr pagebreak nonbreaking anchor insertdatetime advlist lists textcolor wordcount contextmenu colorpicker textpattern', toolbar: 'formatselect | bold italic strikethrough forecolor backcolor | link | alignleft aligncenter alignright alignjustify | numlist bullist outdent indent | removeformat', image_advtab: true, imagetools_toolbar: 'rotateleft rotateright | flipv fliph | editimage imageoptions', templates: [ { title: 'Test template 1', content: 'Test 1' }, { title: 'Test template 2', content: 'Test 2' }, ], content_css: [ '//fonts.googleapis.com/css?family=Lato:300,300i,400,400i', '//www.tinymce.com/css/codepen.min.css', ], setup: (editor) => { console.log(editor.ui); }, }; }

Welcome to the TinyMCE Cloud demo!

Note, this includes some "enterprise/premium" features.Visit the pricing page to learn more about our premium plugins.

Got questions or need help?

A simple table to play with

Found a bug?

Finally ...

Note, this includes some "enterprise/premium" features.
Visit the pricing page to learn more about our premium plugins.