Migrating textAngular / ui-tinymce / ng-ckeditor to modern Angular
textAngular, ui-tinymce and ng-ckeditor bound a WYSIWYG editor to ng-model. The wrappers are tied to AngularJS, and they usually load an old major version of the underlying editor.
What replaces it
| Option | When to choose it |
|---|---|
| TinyMCE (@tinymce/tinymce-angular) | When you used ui-tinymce: the same editor in a current version, with an official Angular component. |
| CKEditor 5 (@ckeditor/ckeditor5-angular) | When you used ng-ckeditor; note that CKEditor 5 is a rewrite of CKEditor 4, with a different plugin and configuration model. |
| Quill (ngx-quill) | A lighter open-source editor when you only need basic formatting; a common replacement for textAngular. |
How to migrate it
- Collect samples of the HTML already stored in your database; the new editor must load and save it without damage.
- Choose the editor, checking its license terms and the toolbar features your users really use.
- Wrap it in one shared component connected to forms through ControlValueAccessor, and swap usages screen by screen.
Watch out. Each editor normalizes HTML in its own way. Open old content in the new editor, save it without changes and compare the output before you go live.
Other libraries
Planning a migration or a micro-frontend platform?
In a 20-minute call you describe your situation and I tell you how I'd approach it. If it isn't worth doing yet, I'll say so.
Message me on LinkedIn