Question

我的问题：

我有3个模板：

main.html.twig（主要布局文件）
layout.html.twig（特定于包的布局覆盖，其中包含一些特定于bundle的JS标记）
create.html.twig（特定于页面的模板文件，其中还包含一些特定于页面的JS标记）

我在我的基本布局（main.html.twig）中定义了一个名为'javascript'的块，然后覆盖它（但在{{ parent() }}中调用layout.html.twig。这很好用，并且JS标记来自主模板文件的内容仍然包含在layout.html.twig模板中。

然后我在create.html.twig文件中执行相同操作，覆盖块，如下所示：

{% block javascripts %}
    {{ parent() }}
    {% javascripts '@BundleName/Resources/public/js/application.album.uploader.js'
                   '@BundleName/Resources/public/js/jquery.uploadify.js'
                   '@BundleName/Resources/public/js/swfuploadify.js' filter='?yui_js' %}
         <script src='{{ asset_url }}' type='text/javascript'></script>
    {% endjavascripts %}
{% endblock %}

此时，它不是仅覆盖父（layout.html.twig）中的javascript块并包含 all 上面模板中定义的脚本，而是执行以下操作：

将<script>标记转储到输出中间（这会导致错误，因为在我的main.html.twig文件中我只在HTML标记的末尾包含了jQuery库
然后它还会将脚本和其他脚本一起转储（正如我所期望的那样）

我不确定是什么原因导致脚本被转储到create.html.twig模板的中间，我也很困惑为什么它们会被转发到屏幕上两次（一次在中间）创建，然后一次在底部以及我main.html.twig和layout.html.twig的所有其余脚本。

有没有人有任何想法？如果有什么不清楚或者我是否可以提供更多信息，请告诉我。

编辑：

文件内容如下......

main.html.twig：https://gist.github.com/7f29353eaca0947528ce

layout.html.twig：https://gist.github.com/734947e9118b7765715e

create.html.twig：https://gist.github.com/c60c8d5c61e00ff86912

编辑2：

今天早上我一直在看这个问题，看起来它对样式表做了同样的事情。我尝试在我的pagescripts中定义一个名为layout.html.twig的新块，然后在我的create.html.twig中使用该块，但这有相同的结果，它似乎只是转储脚本和样式表使用

{% block pagescripts %} 
   (scripts here) 
{% endblock}

Answer 1

我发现了这个问题。在create.html.twig我在{% block javascripts %}内部定义了{% block content %}内容，因此我假设Twig正在javascripts块内呈现content块的输出。

将{% block javascripts %}内容移到{% block content %}块之外会解决问题。

Answer 2

以下是main.html.twig的示例：

<body>
    {% block stylesheets %}
    {% endblock %}

    {% block jsscript %}
    {% endblock %}

    {% block content %}
    {% endblock %}
</body>

进入你的create.html.twig

{% extends '::base.html.twig' %}

{% block jsscript %}
    my javascript files...
{% endblock %}

{% block content %}
<h1>Create</h1>

<form action="{{ path('entity_create') }}" method="post" {{ form_enctype(form) }}>
    {{ form_widget(form) }}
    <p>
        <button type="submit">Create</button>
    </p>
</form>

 {% endblock %}

如果仍有问题，可以添加文档就绪功能：

$(document).ready(function() {
   // put all your jQuery goodness in here.
 });

Symfony2 Assetic + Twig模板JavaScript继承

2 个答案: