Question

我想创建一个对话框，它将是另一个Twig文件的内容。所以在JQuery调用中，我有：

$('<div></div>')
    .html('{% include "folder/file.html.twig" %}')
    .dialog({....

在file.html.twig中有新的行，所以当放入.html调用时它会失败，因为.html调用不允许换行。如果有一种方法可以使用Twig的替换来摆脱可能有效的所有新行，但是，当我使用时：

$('<div></div>')
    .html('{% include "folder/file.html.twig"|replace({"\n":""}) %}')
    .dialog({....

它会替换路径中的所有新行（不存在），而不是呈现的内容。

Answer 1

您可以使用filter tag而不是管道来应用过滤器。

$('<div></div>')
    .html('{% filter replace({"\n":""})%}{% include "folder/file.html.twig" %}{% endfilter}')
    .dialog({....

然而，使用json_encode filter代替替换，将HTML转换为字符串，而不是将其放在引号之间。当包含的HTML包含引号时，这也可以防止出现问题。

$('<div></div>')
    .html({% filter json_encode %}{% include "folder/file.html.twig" %}{% endfilter %})
    .dialog({....

Answer 2

尝试反引号（`）分隔符

$('<div></div>')
.html(`{% include "folder/file.html.twig" %}`)
.dialog({....

Template literals

Answer 3

嗯，这肯定体现了在JavaScript中混合twig html输出的问题，这很容易变得非常混乱，非常快 - 从经验来讲。

尽管如此，你可以通过将包含的模板暴露为渲染控制器来解决这个问题，这样你就可以在纯PHP中更容易地准备响应＆gt; getContent（），即

....
Class Folder{
    ....
    public function fileAction(){
        ....
        $included_template_content = $this->renderView("folder/file.html.twig");
        // Process Content for javascript using php functions
        return new Response($included_template_content);
    }
    ....
}
....

或者，如果您想避免额外的子请求，您可以在Twig扩展

中探索这样做

Answer 4

您可以使用ajax来执行此操作：

public function yourAction(Request $request)
{
    $template =  $request->isXmlHttpRequest() ? 'template_xhr.html.twig' : 'template.html.twig';

    return $this->render($template);
}

和ajax：

$.ajax({ url : 'url', success : function(data) { 
          $("#texte").html(data)
   })

Answer 5

使用无空间标签。它消除了所有空白，因此您的代码和内容不会受到影响，但它将全部显示在一行中：

$('<div></div>')
    .html('{% spaceless %}{% include "folder/file.html.twig" %}{% endspaceless %}')
    .dialog({....

有关详细信息，请参阅http://twig.sensiolabs.org/doc/tags/spaceless.html。

在JQuery .html（）调用中包含Twig模板并删除新行

5 个答案: