如何使用 Twig 函数 return 和插入 HTML 代码？

Question

我正在尝试使用 Twig 动态添加一些图像。所以我定义了一个名为 setImgService 的新 Twig 函数，它基本上检查服务名称并根据它，它将根据其图像 return 一些 HTML 代码。

函数代码：

$setImgService = new Twig_SimpleFunction('setImgService', function($serviceName){
    switch ($serviceName){
        case "Analitycs":
            return '<img src="assets/img/analitycs.png">';
        case "Hosting":
            return '<img src="assets/img/hosting.png">';
        case "SEO":
            return '<img src="assets/img/seo.png">';
        case "Maintenance":
            return '<img src="assets/img/maintenance.png">';
        case "Your own domain":
            return '<img src="assets/img/domain.png">';
        case "BackUp":
            return '<img src="assets/img/backup.png">';   
    }
});
// Add function to Twig
$twig->addFunction($setImgService);

但是当我使用

{{ setImgService('serviceName') }}

它returns HTML代码像纯文本。

有什么帮助吗？

Answer 1

Twig 默认转义输出。要从函数中在 twig 中显示 HTML，您可以使用过滤器 raw 或 return a Twig_Markup，这会将输出标记为安全的，因此它不会无法逃脱。

原始过滤器

{{ setImgService('serviceName') | raw }}

Twig_Markup

$setImgService = new Twig_SimpleFunction('setImgService', function($serviceName){
    switch ($serviceName){
        case "Analitycs":
            return new Twig_Markup('<img src="assets/img/analitycs.png">', 'UTF-8');
        case "Hosting":
            return new Twig_Markup('<img src="assets/img/hosting.png">', 'UTF-8');
        case "SEO":
            return new Twig_Markup('<img src="assets/img/seo.png">', 'UTF-8');
        case "Maintenance":
            return new Twig_Markup('<img src="assets/img/maintenance.png">', 'UTF-8');
        case "Your own domain":
            return new Twig_Markup('<img src="assets/img/domain.png">', 'UTF-8');
        case "BackUp":
            return new Twig_Markup('<img src="assets/img/backup.png">', 'UTF-8');  
    }
});

如何使用 Twig 函数 return 和插入 HTML 代码？

How to return and insert HTML code with a Twig function?

html

twig

twig-extension