Accessing javascript variable inside {{ }} symfony twig

Question

I have an array arr sent from the controller to a twig template containing some JavaScript script , i want to use for loop to access rows of the array like this:

for (var i = 0; i < 3; i++) {
                alert('{{ arr[i] }}');
            }

But the variable i is unknown, i get this error :

Variable "i" does not exist.

Any suggestions?

Answer 1

This is how to get a php array from the controller to a javascript array through twig:

Controller

return $this->render(
    'AppBundle:index.html.twig',
     array(
         'myArray' => array('foo', 'bar', 'z')
     )
);

Twig view

{% block javascripts %}
    <script type="text/javascript">
        var myArray = '{{ myArray | json_encode | raw }}';
    </script>
{% endblock %}

Answer 2

Twig is PHP. You send its values to javascript but you can't take javascript variables to php. (except AJAX etc... but not relevant here)

Possible:

/* javascript variable */
var name = {{ object.name }}
console.log(name);

Impossible:

/* javascript variable */
var name = 'toto';
{# Twig #}
{{ name }} // <- IMPOSSIBLE