'How to add span element to json data?

I have a problem with JSON data. I want to add a span element inside a string, but it doesn't work. How to ''escape'' string? Below is an example.

{
    "text": "Copyright©2020 <span class="test">Gamepix</span> All Rights Reserved."
}
javascripthtmljsonhandlebars.js


Solution 1:[1]

If you're using Typescript you can use in your HTML file [innerHTML].
Example:

<div [innerHTML]="text"></div>

in your typescript file:

text: string = "some text here <span class='yellow'>six pieces</span>, and here";

and in your .scss file:

::ng-deep .yellow {
    color: #f5dc27;
}

Solution 2:[2]

I know I'm a bit late to this question but I just worked this out for myself! The "render" function takes my data in the JSON key "data" and returns the data in "dataname" as well as my desired html tag (span).
Hope this helps!

            {
               "data": "dataname", render: function (data) {
                    return data + '<span></span>';
                }  
            },
            "Other data keys to follow" 
            {
            },

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1
Solution 2 Salvatore Leto

Related Questions