web-dev-qa-db-ja.com

Twigファイルの変数をインクリメントする方法は?

グリッド形式でいくつかの画像をレンダリングするために、ビューグリッドテンプレートとviews-view-fields--view-machine-name.html.twigテンプレートファイルを使用しています。たとえば、次のマークアップを使用して、レンダリングされるすべての画像に動的CSSクラスを割り当てたいです。

<div class="profile-pic pic{{id}}">{{ fields.field_picture.content }}</div>

Twigに次のコードで変数を設定しましたが、ループがないため、インクリメントされません。

{% set id = 0 %}

したがって、すべての画像に同じCSSクラス(profile-pic pic0)があります。

以下を入手したいです。

  • 写真1
    profile-pic pic0
  • 写真2
    プロフィール写真pic1
  • 写真3
    プロフィール写真pic2
  • 写真4
    プロフィール写真pic3

次のコードを使用すると、私が持っている写真の代わりに同じ想像がレンダリングされます。

{% for field in fields -%}
  <div class="profile-pic pic{{id}}">{{ fields.field_picture.content }}</div>
{%- endfor %}

カウンターを増やし、すべての画像をレンダリングするにはどうすればよいですか?

7
Sugandh Khanna

あなたが言ったように、ループはないので、テンプレートファイルではこれを行うことはできません(できますが、努力する価値はありません)。

代わりに、前処理関数で静的変数を維持できます。

function MYTHEME_preprocess_views_view_fields__view_machine_name(&$vars) {
  static $counter = 0;
  $vars['counter'] = $counter++;
}

そして通常通りテンプレートでそれを参照してください:

<div class="profile-pic pic{{ counter }}">{{ fields.field_picture.content }}</div>

たとえば、ビューが同じページで2回レンダリングされる場合など、これを微調整する必要があるかもしれません。

2
Clive