This is a migrated thread and some comments may be shown as answers.

How can I insert a custom Angular element into the kendo-editor value?

2 Answers 188 Views
Editor
This is a migrated thread and some comments may be shown as answers.
Yaroslav
Top achievements
Rank 1
Yaroslav asked on 31 Aug 2020, 04:31 PM

How can I insert a custom Angular element into the kendo-editor value?

I want my kendo-editor to have a feature which allows to upload local images. After uploading the url for the image retrieval requires authentication/authorization. So, I can not rely on the native src handling and have to run a get request for an image src myself to add a few headers.

In order to achieve that I use a pipe which takes the image src, runs a request and transforms the request result into the base64 to show an image.

Now, in order to use the Angular features (e.g. the pipe) in the kendo-editor value I use a custom Angular element. https://angular.io/guide/elements

And the issue is that for some reasons I am not able to insert the custom Angular element into the kendo-editor value, while I only able to make the whole value being equal to the element.

Here is the stackblitz with the issue demonstration: https://stackblitz.com/edit/angular-uv7tpc?file=app%2Fdialog.component.ts.

The file to pay attention to is the dialog.component.ts.

If I change the `<p><custom-img-element></custom-img-element></p>` to the `<custom-img-element></custom-img-element>` the custom element will be inserted just fine, but if I insert the element (i.e. won't remove the `p` enclosing tag), then the element just does not get inserted and disappears.

In case something is not clear in the issue described, please, let me know.

2 Answers, 1 is accepted

Sort by
0
Accepted
Ivan
Telerik team
answered on 02 Sep 2020, 12:54 PM

Hi Yaroslav,

Currently KendoEditor for Angular does not support custom elements and those are out filtered from the data binding , after is saved "successfully".

There is a feature request for supporting custom tags in our feedback portal, you can comment and vote for it. Thus we will target better our focus for future releases.

Regards,
Ivan
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

0
Yaroslav
Top achievements
Rank 1
answered on 02 Sep 2020, 12:58 PM

Since ProseMirror allows adding schemas, probably you could also allow to add the schemas in kendo-editor in future.

https://prosemirror.net/examples/dino/.

Anyway, thank you for your answer. :)

Tags
Editor
Asked by
Yaroslav
Top achievements
Rank 1
Answers by
Ivan
Telerik team
Yaroslav
Top achievements
Rank 1
Share this question
or