How to correctly include blocks with javascript code in two (parent-child) twigs in Symfony2?

E

e-hot2017-06-15 23:51:10

JavaScript

e-hot, 2017-06-15 23:51:10

Greetings. Need advice on the following situation:
1. There are nested templates, where the base one is:

<html lang="ru">
    <head>
        ... 
        {% block stylesheets %}
            <link rel="stylesheet" href="{{ asset('/css/какие-то_стили.css') }}">
        {% endblock %}
    </head>
    
    <body>
        <div class="container">
            {% block body %}{% endblock %}
        </div>
        
        {% block javascripts %}
            <script src="{{ asset( '/js/какая-то_библиотека.js' ) }}" type="text/javascript"></script>
            ...
        {% endblock %}
    </body>
</html>

This is followed by several nested templates, such as:

{% extends 'AcmeAppBundle:Default:body.html.twig' %}
{% block items %}
    ...
    <section class="content">
        {% block list%}{% endblock %}
    </section>
    ...
{% endblock%}

and at the last level there is:

{% extends 'AcmeAppBundle:Items:items.html.twig' %}

{% block list %}
            <div id="map"></div>

    {% block javascripts %}
        <script type="text/javascript">
            var map = L.map( 'map' ).setView( [ {{ center }} ], 13 );

            L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
                attribution: '&copy; <a rel="nofollow" href="http://osm.org/copyright">OpenStreetMap</a> contributors'
            }).addTo( map );

            {% for item in data %}
                var marker = L.marker( [ {{ item.getLa }},{{ item.getLo }} ], { icon: icon } ).addTo( map );
            {% endfor %}
        </script>
    {% endblock %}
{% endblock %}

note: here I had to pass php data to the js code through twig variables {{ var }} - such a mess of syntaxes

2. In the base and last templates there is a construction {% block javascripts %}...{% endblock % }. As I understand it, when assembling templates, SF2 leaves the construction from the last template in effect, because it turns out to be primary in the stream, but it no longer “sees” the construction from the base one - as a result, when we look at the code of the compiled page through the browser’s firebug, we get a chopped off code without the libraries needed for the last template:

{% block javascripts %}
            <script src="{{ asset( '/js/какая-то_библиотека.js' ) }}" type="text/javascript"></script>
            ...
{% endblock %}

3. And the question itself: how to correctly connect js-libraries in two (or more) twigs that relate to each other as a parent-child? Or in other words: how to correctly write js code in nested templates or designate / form twig blocks for js code so that the js libraries initially included in the base template continue to work? If you need any more details, please ask.

Thanks in advance for your replies. Thank you.

Reply

Answer the question

In order to leave comments, you need to log in

1 answer(s)

D

Denis, 2017-06-15
@e-hot

https://twig.sensiolabs.org/doc/2.x/functions/pare...
Use {{ parent() }} in child template.