1. Home
  2. Forum
  3. Angular - EJ 2
  4. Adding rich text editor to a synfusion planner demo does not work

Adding rich text editor to a synfusion planner demo does not work

https://github.com/syncfusion/ej2-showcase-angular-appointment-planner  <<<demo project

Following along the most basic setup: And it works on a fresh project but no on the demo project
https://ej2.syncfusion.com/angular/documentation/rich-text-editor/getting-started?cs-save-lang=1&cs-lang=ts#adding-rich-text-editor-component
added this into imports of app module :

RichTextEditorModule,


The following error is produced no matter where I place the HTML part of the code

core.mjs:11809 ERROR TypeError: str.match is not a function

    at evalExp (ej2-base.es5.js:9525:23)

    at compile$1 (ej2-base.es5.js:9503:29)

    at Engine.compile (ej2-base.es5.js:9878:16)

    at compile$$1 (ej2-base.es5.js:9731:30)

    at RichTextEditor.setValue (ej2-richtexteditor.es5.js:34093:47)

    at RichTextEditor.setContainer (ej2-richtexteditor.es5.js:32523:18)

    at RichTextEditor.preRender (ej2-richtexteditor.es5.js:32506:14)

    at Component.appendTo (ej2-base.es5.js:7439:18)

    at FormBase.ngAfterViewInit (form-base.js:76:39)

    at callHookInternal (core.mjs:3599:14)


3 Replies
VJ Vinitha Jeyakumar Syncfusion Team January 22, 2024 12:30 PM UTC

Hi Frank Alberts,

We suspect that the reported issue occurred due to the duplicate packages or due to the package cache in your application. Please follow the below steps to resolve this,  


  • Go to the ‘node_modules’ folder, find the ‘@syncfusion’ folder and delete it.
  • Now delete the ‘package-lock.json’ file from the root directory of the project.
  • Now run command ‘npm cache clean –force’.
  • The run the command ‘npm install’.
  • After the dependencies are installed, run the application.
Also ensure that all the Syncfusion packages are using same version to avoid version conflicts.

Please let us know if it doesn't resolve your issue.

Regards,
Vinitha



JB Jonas Blazinskas January 22, 2024 01:52 PM UTC

You were correct it is working now but I have a new issue, the licensing worked out of the box for some reason on that project straight using the gihub repo I think.

Now it broke and I am attempting to set up licensing how I normally do but it is not working for some reason:

I added this to main.ts

import { registerLicense } from '@syncfusion/ej2-base';

registerLicense('latest key for 23.1.44');


Please not that github repo had this "*" for package versions I assume it just installs the latest? 
a

    "@syncfusion/ej2-angular-buttons": "*",
    "@syncfusion/ej2-angular-calendars": "*",
    "@syncfusion/ej2-angular-charts": "*",
    "@syncfusion/ej2-angular-dropdowns": "*",
    "@syncfusion/ej2-angular-grids": "*",
    "@syncfusion/ej2-angular-inputs": "*",
    "@syncfusion/ej2-angular-lists": "*",
    "@syncfusion/ej2-angular-navigations": "*",
    "@syncfusion/ej2-angular-notifications": "*",
    "@syncfusion/ej2-angular-popups": "*",
    "@syncfusion/ej2-angular-richtexteditor": "*",
    "@syncfusion/ej2-angular-schedule": "*",
    "@syncfusion/ej2-angular-splitbuttons": "*",



VJ Vinitha Jeyakumar Syncfusion Team February 26, 2024 06:33 AM UTC

Hi Jonas Blazinskas,


Query "Please not that github repo had this "*" for package versions I assume it just installs the latest?"


Yes adding "*" for package versions will install the latest version of that Syncfusion package.


Regards,

Vinitha


Loader.
Up arrow icon