使用数组变量在

页面

的底部加载JavaScript的我想用一种全局数组的定义什么JavaScript的应在页面结束加载。这样，我可以动态地添加JavaScript文件。使用数组变量在

问题是基础模板首先被渲染。想象一下，在此基础HTML：

{% set javascriptList = [ 'js/vendor/jquery-1.10.1.min.js', 'js/vendor/bootstrap.min.js', 'js/main.js' ] %} 
<!DOCTYPE html> 
<head> 
    <title>my project</title> 
</head> 
<body> 

{% block container %} 
content goes here 
{% endblock %} 

{% block javascripts %} 
    {% for js in javascriptList %} 
     <script src="{{ asset(js) }}"></script> 
    {% endfor %} 
{% endblock %} 

</body> 
</html>

然后我会在一个页面，是这样的：

{% extends base.html.twig %} 

{% block container %} 
<h1>Demo</h1> 

Bla bla 

Code I want to reuse: 

{% include 'code-with-js.html.twig' %} 
{% endblock %}

然后我的代码与 - js.html.twig是：

<div id="DemoContent"> 
Some content, with a <a href="#" rel="tooltip">tooltip</a> thingy maybe. 
</div> 

{% set javascriptList = javascriptList|merge(['js/tooltip.js']) %}

所以，使用这个设置，我可以确保正在添加正确的JavaScript，当一段html被包括在内。

但是，这当然不起作用。基本html首先被渲染，所以元素将在渲染后被添加到javascriptList数组中。我的方法一定是错的。

在我的项目这可重用的代码实际上是与插入内容到文字区域的一些额外的按钮的形式（所以TinyMCE的，但是很多很多更简单）。我想在几个页面上重复使用这些代码（创建，更新）。

欢迎任何想法！

来源

2013-07-02 rolandow

首先，我建议你在你的base.html.twig添加Javascript块：

您可以将您的脚本加载后您的base.html.twig添加块：

{% block javascripts %} 
    {% for js in javascriptList %} 
     <script src="{{ asset(js) }}"></script> 
    {% endfor %} 
{% endblock %} 

<script type="text/javascript"> 
{% block afterJavascriptLoad %} 

{% endblock %} 
</script>

有了继承，你就可以在嵌套模板中的所有脚本加载后执行JavaScript：

{% extends base.html.twig %} 

{% block afterJavascriptLoad %} 
    //Your code to be executed after base.html script load 
{% endblock %}

拥有HTML代码和JavaScript代码是不是AV很好的练习。例如，如果您的页面中有3个tinyMCE修饰符，则会加载3次tinyMCE。

对我来说，最好的办法是让你的模板是这样的：

base.html.twig：

{% block container %} 
content goes here 
{% endblock %} 

{% block javascripts %} 
    {% for js in javascriptList %} 
     <script src="{{ asset(js) }}"></script> 
    {% endfor %} 
{% endblock %} 

{% block afterJavascriptLoad %} 
    //Your code to be executed after base.html script load 
{% endblock %}

pageWithTinyMCE.html.twig：

{% extends base.html.twig %} 

{% block container %} 
    <h1>Demo</h1> 

    Bla bla 

    Code I want to reuse: 

    {% include 'code-without-js.html.twig' %} 
    {% set javascriptList = javascriptList|merge(['js/tooltip.js']) %} 
{% endblock %} 

{% block afterJavascriptLoad %} 
    //Custom javascript for the page 
{% endblock %}

来源

2013-07-02 15:53:18

使用数组变量在

回答

相关问题