Comparison in twig templates

Question

I have a list field for a custom content type that looks like this:

Field Machine name is: field_app_os

key|label
Win|Windows
Android|Android

I can access the key in Twig template by using content.field_app_os or Twig Field Value and the output of both is Android:

Twig Field Value allows Drupal 8 themers to get partial data from field render arrays. It gives them more control over the output without drilling deep into the render array or using preprocess functions.
Filters:
- field_label : Returns the field label value.
- field_value : Returns the render array of the field value(s) without the field wrappers.

/* with use of Twig Field Value module */
{{ content.field_app_os|field_value }}  {# outputs 'Android' #}

 /* without use of Twig Field Value module */
{{ content.field_app_os }}  {# outputs 'Android' #}

However, if I do a simple comparison, the output of both is False.

{% set app_os = content.field_app_os|field_value %}
{{ kint(app_os == 'Android') }} {# outputs 'bool FALSE' #}

Or When I use:

{% set app_os = content.field_app_os %}
{{ kint(app_os == 'Android') }} {# outputs 'bool FALSE' #}

What's wrong in my code?

Answer 1

{{ content }} is a render array, where you find the label of the key/label pair probably here:

{{ content.field_app_os[0]['#markup'] }}

But this is not ideal for logic:

1. The position in the render array can change, for example if you install a layout module.
2. The content of #markup depends on how the field formatter is configured in the view mode.
3. The label is translatable, so the logic breaks on a multilingual site.

So it's better to use the database value in:

{{ node.field_app_os.value }}

This is the first part of the key/label pair, which is untranslatable and you can access the value independent on how the field is configured in the view mode.