1

This is my first effort at Twig development so please bear with me. I have a vanilla Drupal 8.1 site with a content type that contains just the body and a File type field called field_fichier_svg. This will contain SVG files (surprise!) and I want to override the Twig field rendering so that I can get the raw file name and wrap an "img" HTML tag around it.

I have successfully installed kint, and have overridden the field template with one called field--node--field-fichier-svg--icon.html.twig (the field is used in a content type called "icon") and this works.

I have also succeeded in running kint() and getting the output.

But none of the attempts I have made at getting the value of the field function. In the snippets below you can see the three different attempts I have made.

1) Try to identify the class that handles file entities and use that:

{%
  set classes = [
    'file'
  ]
%}
<img id="entity" src="{{file.label}}" />

2 & 3) Loop round "items" and try different things which I have tried to interpret from the kint output (kint does work by the way)

{% for item in items %}
  <img id="label" src="{{ item.label }}"/>
  <img id="array" src="{{item.content['#file'].values['filename']['x-default']}}" />
  {{kint(item.content)}}
{% endfor %}

In all cases the "src" attribute is just blank.

To make it a bit more manageable I tried putting

{{dump(item.content|keys)}} 

and I get this:

array(5) { [0]=> string(6) "#theme" [1]=> string(5) "#file" [2]=> string(12) "#description" [3]=> string(6) "#cache" [4]=> string(11) "#attributes" } 

Then I tried

{{dump(item.content['#file']|keys)}} 

and I get this:

array(11) { [0]=> string(3) "fid" [1]=> string(4) "uuid" [2]=> string(8) "langcode" [3]=> string(3) "uid" [4]=> string(8) "filename" [5]=> string(3) "uri" [6]=> string(8) "filemime" [7]=> string(8) "filesize" [8]=> string(6) "status" [9]=> string(7) "created" [10]=> string(7) "changed" } 

but if I try

 {{item.content['#file']['filename']}}

I just get nothing

0

1 Answer 1

5

to get the filename you can use this:

{{ item.content['#file'].filename.value }} 

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.