https://szeching.com/tags/twig/ Recent content in Twig on 瓶子裡的小狐狸 Hugo zh-Hant Wed, 13 Apr 2022 16:00:00 +0000 https://szeching.com/drupal-9-twig-cheatsheet-about-getting-field-values/ Wed, 13 Apr 2022 16:00:00 +0000 https://szeching.com/drupal-9-twig-cheatsheet-about-getting-field-values/ <p>在Drupal 8 和 Drupal 9 的 twig 模板開發中，常常會需要輸出指定的field，本文列出常見類型的field取值方法，以便查詢。</p> <h2 id="一般類型-general">一般類型 General<a class="anchorjs-link" href="#%e4%b8%80%e8%88%ac%e9%a1%9e%e5%9e%8b-general"></a></h2><table> <thead> <tr> <th>Field type</th> <th>How to get value</th> <th>Note</th> </tr> </thead> <tbody> <tr> <td>Boolean</td> <td><code>{{ content.field_name[0] }}</code></td> <td>值為“On”或“Off”的label</td> </tr> <tr> <td>Boolean</td> <td><code>{{ content.field_name['#items'][0].value }}</code></td> <td>值為1或0</td> </tr> <tr> <td>Date</td> <td><code>{{ content.field_name[0] }}</code></td> <td>值為套用<code>time.html.twig</code>模板的完整日期時間html片段</td> </tr> <tr> <td>Date</td> <td><code>{{ content.field_name[0]['#text] }}</code></td> <td>值為完整日期時間格式的純文本</td> </tr> <tr> <td>Timestamp</td> <td><code>{{ content.field_name[0] }}</code></td> <td>值為完整日期時間格式的純文本</td> </tr> <tr> <td>Timestamp</td> <td><code>{{ content.field_name['#items'][0].value }}</code></td> <td>值為時間戳數字</td> </tr> <tr> <td>Email</td> <td><code>{{ content.field_name[0] }}</code></td> <td>值為純文本格式</td> </tr> <tr> <td>link</td> <td><code>{{ content.field_name[0]['#url'] }}</code></td> <td>值為連結URL</td> </tr> <tr> <td>link</td> <td><code>{{ content.field_name[0]['#title'] }}</code></td> <td>值為連結文字</td> </tr> </tbody> </table> <h2 id="數字類型-number">數字類型 Number<a class="anchorjs-link" href="#%e6%95%b8%e5%ad%97%e9%a1%9e%e5%9e%8b-number"></a></h2><table> <thead> <tr> <th>Field type</th> <th>How to get value</th> <th>Note</th> </tr> </thead> <tbody> <tr> <td>Number (float)</td> <td><code>{{ content.field_name[0] }}</code></td> <td>顯示有前綴和後綴並number_decimal格式化</td> </tr> <tr> <td>Number (float)</td> <td><code>{{ content.field_name['#items'][0].value }}</code></td> <td>顯示未經格式化的浮點數</td> </tr> <tr> <td>Number (integer)</td> <td><code>{{ content.field_name[0] }}</code></td> <td>顯示有前綴和後綴</td> </tr> <tr> <td>Number (integer)</td> <td><code>{{ content.field_name['#items'][0].value }}</code></td> <td>顯示未經格式化的整數</td> </tr> <tr> <td>Number (decimal)</td> <td><code>{{ content.field_name[0] }}</code></td> <td>顯示有前綴和後綴</td> </tr> <tr> <td>Number (decimal)</td> <td><code>{{ content.field_name['#items'][0].value }}</code></td> <td>顯示未經格式化的小數</td> </tr> </tbody> </table> <h2 id="文字類型-text">文字類型 Text<a class="anchorjs-link" href="#%e6%96%87%e5%ad%97%e9%a1%9e%e5%9e%8b-text"></a></h2><table> <thead> <tr> <th>Field type</th> <th>How to get value</th> <th>Note</th> </tr> </thead> <tbody> <tr> <td>Text (formatted)</td> <td><code>{{ content.field_name[0] }}</code></td> <td>帶格式的文本</td> </tr> <tr> <td>Text (formatted)</td> <td><code>{{ content.field_name[0]['#text'] }}</code></td> <td>未經html轉化的文本</td> </tr> <tr> <td>Text (formatted)</td> <td><code>{{ content.field_name['#items'][0].value|striptags }}</code></td> <td>純文本</td> </tr> <tr> <td>Text (formatted, long)</td> <td><code>{{ content.field_name[0] }}</code></td> <td>帶格式的文本</td> </tr> <tr> <td>Text (formatted, long)</td> <td><code>{{ content.field_name[0]['#text'] }}</code></td> <td>未經html轉化的文本</td> </tr> <tr> <td>Text (formatted, long)</td> <td><code>{{ content.field_name['#items'][0].value|striptags }}</code></td> <td>純文本</td> </tr> <tr> <td>Text (formatted, long with summary)</td> <td><code>{{ content.field_name[0] }}</code></td> <td>帶格式的文本</td> </tr> <tr> <td>Text (formatted, long with summary)</td> <td><code>{{ content.field_name[0]['#text'] }}</code></td> <td>未經html轉化的文本</td> </tr> <tr> <td>Text (formatted, long with summary)</td> <td><code>{{ content.field_name['#items'][0].value|striptags }}</code></td> <td>純文本</td> </tr> <tr> <td>Text (formatted, long with summary)</td> <td><code>{{ content.field_name['#items'][0].summary }}</code></td> <td>摘要</td> </tr> <tr> <td>Text (plain)</td> <td><code>{{content.field_name.0 }}</code></td> <td>純文本</td> </tr> <tr> <td>Text (plain, long)</td> <td><code>{{content.field_name.0 }}</code></td> <td>純文本</td> </tr> </tbody> </table> <h2 id="列表類型-list">列表類型 List<a class="anchorjs-link" href="#%e5%88%97%e8%a1%a8%e9%a1%9e%e5%9e%8b-list"></a></h2><table> <thead> <tr> <th>Field type</th> <th>How to get value</th> <th>Note</th> </tr> </thead> <tbody> <tr> <td>List (float)</td> <td><code>{{ content.field_name[0] }}</code></td> <td>在管理介面Manage Display中設置該欄位顯示值key或標籤label</td> </tr> <tr> <td>List (float)</td> <td><code>{{ content.field_name['#items'][0].value }}</code></td> <td>顯示值的key</td> </tr> <tr> <td>List (integer)</td> <td><code>{{ content.field_name[0] }}</code></td> <td>在管理介面Manage Display中設置該欄位顯示值key或標籤label</td> </tr> <tr> <td>List (integer)</td> <td><code>{{ content.field_name['#items'][0].value }}</code></td> <td>顯示值的key</td> </tr> <tr> <td>List (text)</td> <td><code>{{ content.field_name[0] }}</code></td> <td>在管理介面Manage Display中設置該欄位顯示值key或標籤label</td> </tr> <tr> <td>List (text)</td> <td><code>{{ content.field_name['#items'][0].value }}</code></td> <td>顯示值的key</td> </tr> </tbody> </table> <h2 id="參照類型-reference">參照類型 Reference<a class="anchorjs-link" href="#%e5%8f%83%e7%85%a7%e9%a1%9e%e5%9e%8b-reference"></a></h2><table> <thead> <tr> <th>Field type</th> <th>How to get value</th> <th>Note</th> </tr> </thead> <tbody> <tr> <td>Fiel</td> <td><code>{{ content.field_name[0] }}</code></td> <td>值為套用<code>file-link.html.twig</code>模板的html片段</td> </tr> <tr> <td>File</td> <td><code>{{ file_url(content.field_name[0]['#file'].uri.value) }}</code></td> <td>檔案連結</td> </tr> <tr> <td>File</td> <td><code>{{ content.field_name[0]['#description'] }}</code></td> <td>檔案描述</td> </tr> <tr> <td>Image</td> <td><code>{{ file_url(content.field_name[0]['#item'].entity.uri.value) }}</code></td> <td>圖片連結</td> </tr> <tr> <td>Image</td> <td><code>{{ content.field_name[0]['#item'].value.alt }}</code></td> <td>圖片alt文字</td> </tr> <tr> <td>Image</td> <td><code>{{ content.field_name[0]['#item'].value.title }}</code></td> <td>圖片title文字</td> </tr> <tr> <td>Image</td> <td><code>{{ content.field_name[0]['#item'].value.height }}</code></td> <td>圖片設置的高度</td> </tr> <tr> <td>Image</td> <td><code>{{ content.field_name[0]['#item'].value.width }}</code></td> <td>圖片設置的寬度</td> </tr> <tr> <td>Taxonomy Term</td> <td><code>{{ content.field_taxonomy[0]['#options'].entity.id }}</code></td> <td>在Manage display中將format設為Label時顯示term id</td> </tr> <tr> <td>Taxonomy Term</td> <td><code>{{ content.field_name[0]['#title'] }}</code></td> <td>在Manage display中將format設為Label顯示term label</td> </tr> <tr> <td>Taxonomy Term</td> <td><code>{{ content.field_name[0]['#url'] }}</code></td> <td>在Manage display中將format設為Label顯示term path</td> </tr> </tbody> </table> <h2 id="媒體類型-media">媒體類型 Media<a class="anchorjs-link" href="#%e5%aa%92%e9%ab%94%e9%a1%9e%e5%9e%8b-media"></a></h2><p>啟用Media模組後出的media field。</p>