web-dev-qa-db-ja.com

タグ内でtwigデバッグしてHTMLが壊れないようにする方法

これはもともとビューフィールドの書き換えでしたが、それ以降、

views-view-fields--[view name]--[machine ID].html.twig

そして動作は同じようです：

 <a href="{{ fields.path.content}}" class="menu-item">{{fields.title.content}}<span data-background-image="{{ fields.field_image.content}}"></span></a>

これは、twig debugがdevelopment.services.ymlでfalseに設定されている場合にうまくレンダリングされます。twig debugがオンになっている場合、マークアップが大幅に壊れます。

つまり.

<span data-background-image="

    <!-- THEME DEBUG -->
    <!-- THEME HOOK: 'views_view_field' -->
    <!-- BEGIN OUTPUT from 'themes/mytheme/templates/views/views-view-field.html.twig' -->


    <!-- THEME DEBUG -->
    <!-- THEME HOOK: 'image_url_formatter' -->
    <!-- BEGIN OUTPUT from 'modules/contrib/image_url_formatter/templates/image-url-formatter.html.twig' -->
    http://mysite.local/sites/default/files/styles/menus_image/public/menus/image.png?itok=1ZnZSCkX
    <!-- END OUTPUT from 'modules/contrib/image_url_formatter/templates/image-url-formatter.html.twig' -->


    <!-- END OUTPUT from 'themes/mytheme/templates/views/views-view-field.html.twig' -->

    "></span>

HTMLは<!-- -->内部タグをサポートしていません。これは、中心的な問題のようです。これの回避策はありますか、それともTwig debugの制限です）？

theming8debugging
6
baku

_|render|striptags|trim_ twigフィルターを適用できます：

_<a href="{{ fields.path.content|render|striptags|trim }}" class="menu-item">{{ fields.title.content }}<span data-background-image="{{ fields.field_image.content|render|striptags|trim }}"></span></a>
_

_div or img tags_のように保存（削除ではなく）したい場合は、次のように書くこともできます。

{{ fields.field_image.content|render|striptags('<div>, <img>')|trim }}

ここに表示 https://www.drupal.org/node/2672656#comment-11821896

9
Francesc Bassas i Bullich