Iterate through user custom fields in twig

Question

I'm trying to iterate through a user reference field using twig. I'm able to get the username, but not any of the custom fields that I made for users such as "First Name" and "Last Name".

{% for item in items %}
  {{ kint(item.content['#options']) }}
  {{ item.content['#title'] }}
{% endfor %}

I'm trying to get the email address as well, but I can't figure out how to get these values.

I thought it would be something like:

{{ item.content['#options'].entity.mail }}

When I do that, the entire site crashes and I get errors. Am I doing something wrong?

Answer 1

You should never try to display field values by going that deep into structured field properties data within your Twig templates.

Consider using according field displays, or hook_preprocess_HOOK() to preprocess your template variables, e.g. by providing a simple array of preprocessed item data the template can iterate over (an abstract example to put into your mytheme.theme file; where you have to replace mytheme with the name of your theme and themehook with the template's theme registry hook - usually the template name with underscores instead of dashes):

/**
 * Implements hook_preprocess_HOOK().
 */
function mytheme_preprocess_themehook(&$variables) {
  // This will be the new list variable to attach to the
  // template.
  $users_list = [];

  // Get the entity object from existing theme variables.
  // This example assumes you have a node entity in
  // your variables array already.
  $entity = $variables['#node'];

  // Load all referenced users from a field named
  // 'field_users_entityreference'.
  $users = $entity->get('field_users_entityreference')->referencedEntities();

  // Iterate through all users found.
  if (!empty($users)) {
    foreach($users as $user) {
      $item = [
        // Add whichever properties you'd like
        // to show within your template.
        'email' => $user->getEmail(),
      ];
      $users_list[] = $item;
    }
  }

  // Attach the new variable to the template.
  $variables['users_list'] = $users_list;
}

In your Twig template you can now access the users list by accessing the new users_list variable:

{% if users_list %}
  {% for item in users_list %}
    {{ item.email }}
  {% endfor %}
{% endif %}

EDIT:

According to the template name you provided, you are trying to alter how the entity reference field itself is displayed. Generally you have the following choices:

(1) Using field display: Add an according display to the user entity and change the field display to rendered Entity using this display. You can do so by

• Go to "Admin / Structure / Display modes / View modes".
• Find the User entity (should be somewhere at the bottom) and add a new user view mode.
• Then go to "Admin / Configuration / People / Account settings / Manage display".
• Choose the newly created view mode and add all fields you want to show.
• Within "Admin / Structure", head to the entity using the reference field and find the "Manage display" tab.
• At the field in question change the Format to rendered entity and choose your newly created display mode by clicking the cogwheel at the very right of the row.

This approach usually fits your needs if you don't want to digg too deep into programming. Unfortunately you'd like to show the email address. This field is usually not available in user displays (privacy reasons; re-consider if you really want to show it). If you like to add that field to a regular user view, you'd have to additionally implement hook_ENTITY_TYPE_view().

(2) Alter the additional template variables within a preprocessing hook:

• Within "Admin / Structure", head to the entity using the reference field and find the "Manage display" tab.
• At the field in question change the Format to Entity ID.
• Implement a preprocessing hook as described above.
• Fetch the item IDs from the existing variables and load the user entities.

• Attach your information to the variables and use it within your template:

  $users = \Drupal\user\Entity\User::loadMultiple($variables['items']);