使用數組變量在

頁面

的底部加載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

使用數組變量在

回答

相關問題