Symfony2 Assetic + Twig 模板 JavaScript 继承
Posted
技术标签:
【中文标题】Symfony2 Assetic + Twig 模板 JavaScript 继承【英文标题】：Symfony2 Assetic + Twig Template JavaScript Inheritance 【发布时间】：2012-02-04 20:34:40 【问题描述】：我的问题：
我有 3 个模板：
main.html.twig（主布局文件）
layout.html.twig（特定于 bundle 的布局覆盖，其中包含一些特定于 bundle 的 JS 标签）
create.html.twig（页面特定的模板文件，其中还包含一些页面特定的 JS 标签）
我在我的基本布局（main.html.twig）中定义了一个名为“javascript”的块，然后覆盖它（但在layout.html.twig 中调用 parent() 。这工作正常，主模板文件中的 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 块并包含 所有 在其上方模板中定义的脚本，而是执行以下操作：
<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：
今天早上我再次查看了这个问题，它看起来好像对样式表做同样的事情。我试图在我的layout.html.twig 中定义一个名为pagescripts 的新块，然后在我的create.html.twig 中使用该块，但这具有相同的结果，它似乎只是在我使用的任何地方转储脚本和样式表
% block pagescripts %
(scripts here)
% endblock
【问题讨论】：
当脚本标签被转储到页面中间时，它是否也包含 parent() 输出？
不只是我的create.html.twig 文件中的三个脚本
@KrisWallsmith 有什么我可以尝试 Kris 的想法吗？如果需要，我可以发布有问题的文件内容的精简版本
请发布更多信息，我会调查一下。
@KrisWallsmith 很酷，我稍后会在 github 上发布要归咎于文件的要点
【参考方案1】：
这里是 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.
);
【讨论】：
不幸的是，jQuery 库确实会加载，但只是稍后才会加载，所以我不想加载库两次......如果我的脚本标签呈现在正确的位置，jquery 库将在任何加载之前加载使用它jsscript == "javascriptscript"? :)【参考方案2】：
我发现了问题。在create.html.twig 中，我在% block content % 内部定义了% block javascripts % 内容，所以我假设Twig 在content 块内部呈现javascripts 块的输出。
将% block javascripts % 内容移到% block content % 块之外解决了这个问题。
【讨论】：
以上是关于Symfony2 Assetic + Twig 模板 JavaScript 继承的主要内容，如果未能解决你的问题，请参考以下文章
尝试在我的项目中实现没有 Symfony2 的 Twig 和 Assetic
在 Symfony2 中使用 Twig 作为 JavaScript 的资产过滤器
使用 Silex/SilexExtensions 和 Assetic 在 Twig 中动态 CSS/Javascript