Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

276
Vistas
Visual Studio Code: Jinja Curly Braces inline for Javascript variable

I am trying to get Jinja braces to stay in line for a javascript variable used in an apexchart.js call for a flask HTML page.

labels = JSON.parse({{ labels | tojson}})

data = JSON.parse({{ data | tojson}})

The problem I am having is that when I save the html the braces get formatted apart.

    labels = JSON.parse({
        {
            labels | tojson
        }
    })
    data = JSON.parse({
        {
            data | tojson
        }
    })

Is there away to stop Visual Studio Code from splitting the Jinja code apart?

Current Code Below:


<!-- language: lang-html -->

    <!-- templates/index.html -->

    {% extends 'base.html' %} {% block content %}

    <title>Dashboard | {{title}}</title>
    <div class="flex h-screen justify-center">
        <div id="chart" class="h-1/4 w-1/2 content-center"></div>
    </div>
    <script src="https://cdn.jsdelivr.net/npm/apexcharts"></script>
    <script>
        labels = JSON.parse({
            {
                labels | tojson
            }
        })
        data = JSON.parse({
            {
                data | tojson
            }
        })
        var options = {
            colors: ['#01ca95'],
            chart: {
                type: 'bar'
            },
            dataLabels: {
                enabled: false
            },
            series: [{
                name: 'sales',
                data: data
            }],
            xaxis: {
                categories: labels
            },
            yaxis: {
                labels: {
                    formatter: function(data) {
                        //Setup new Formatting class variable 
                        var Formatter = new Intl.NumberFormat('en-US', {
                            style: 'currency',
                            currency: 'USD'
                        });

                        return Formatter.format(data);
                    }
                }
            },
        }
        var chart = new ApexCharts(document.querySelector("#chart"), options);

        chart.render();
    </script>

    {% endblock content %}

about 4 years ago · Juan Pablo Isaza
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda