How to render application/ld+json Schema Markup with dynamic variables?

[alexsergivan]

Hi!
I want to dynamically render this:

<script type="application/ld+json">
{
  "@context": "http://schema.org",
  "@type": "WebPage",
  "name": "Pages name",
  "description": "dynamic description",
  "url": "URL of page home"
}
</script>

I've tried this:

templ PagesSchema(title string) {
	<script type="application/ld+json">
{
  "@context": "http://schema.org",
  "@type": "WebPage",
  "name": { title },
  "description": "dynamic description",
  "url": "URL of page home"
}
</script>
}

but it does not replace {title} with the value.
Can you please suggest how to fix it?

[blackfyre]

I'm also curious about this!
It has to with how templ manages JS with the scripts template, but I haven't dug any deeper yet.
Worst case I need to create the whole script block as a string and output raw html...

[uszebr]

I found a solution using script. It is working when I send [10, 41, 35, 51, 49, 62, 69, 91, 148] as statData templ

templ ChartScript(statData []int){
 @graph3(statData)
}

script graph3(custom []int) {
  console.log("graph3 executing..")
            var options = {
                series: [{
                    name: "Desktops",
                    data: custom//[10, 41, 35, 51, 49, 62, 69, 91, 148]
                }],
                chart: {
                    height: 350,
                    type: 'line',
                    zoom: {
                        enabled: false
                    }
                },
                dataLabels: {
                    enabled: false
                },
                stroke: {
                    curve: 'straight'
                },
                title: {
                    text: 'Product Trends by Month',
                    align: 'left'
                },
                grid: {
                    row: {
                        colors: ['#f3f3f3', 'transparent'], // takes an array which will be repeated on columns
                        opacity: 0.5
                    },
                },
                xaxis: {
                    categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep'],
                }
            };
             function showChart() {
            console.log("showChart executing..")