使用Twig获取动态Javascript文件

Question

我正在开发一种仪表板迷你站点,它具有一定功能的块.使用symfony2我有一个专用的路线/ Instagram,它获得一个html片段,显示我们场地拍摄的所有图像.

我想每10分钟刷新一次这个块,所以我需要在带有setTimeout的函数中运行以下javascript,为清楚起见省略.

jQuery('.gallery').load("/instagram", function() {
    jQuery('.gallery').cycle({
        fx: 'fade'
    });
});

此代码位于"@ KunstmaanDashboardBundle/Resources/public/js/instagram.js"中,我通过Assetic进行连接和优化.

{% javascripts
    '@KunstmaanDashboardBundle/Resources/public/js/thirdparty/jquery-1.7.min.js'
    '@KunstmaanDashboardBundle/Resources/public/js/thirdparty/jquery.cycle.lite.js'
    '@KunstmaanDashboardBundle/Resources/public/js/*'
    filter='closure'
%}
    <script src="{{ asset_url }}"></script>
{% endjavascripts %}

这是有效的,但我不认为这是一种最佳方法,因为我必须在load()函数中硬编码路由.要解决此问题,我需要将instagram.js内容移动到Twig模板并将其更改为:

jQuery('.gallery').load("{{ path('KunstmaanDashboardBundle_instagram') }}", function() {
    jQuery('.gallery').cycle({
        fx: 'fade'
    });
});

但是这样我就失去了优化和分离Assetic的内容优势.我们的自定义代码最需要这种优化.

所以我的问题是,如何将Assetic Javascript(和css)与Twig解析器结合起来,这样我就可以将上面的代码放在instagram.js文件中并使其工作:)

Answer 1

您当前无法使用Assetic处理Twig模板的输出,因为Assetic会静态转储资产以进行生产,而Twig模板则在运行时处理.

对于这个问题,您可以使用FOSJsRoutingBundle来公开路由并处理它的客户端,然后您的JavaScript可以使用Assetic进行处理.