Inline Template with Render Array in #context

Question

I'm using the https://api.drupal.org/InlineTemplate to render a string with a variable, and that variable is itself another theme function.

My reading of the documentation is that this is supported; based on the fact that the #context variable can be a string or render array.

#context: (array) The variables to substitute into the Twig template. Each variable may be a string or a render array.

However, my implementation is not working:

    $my_subtemplate = [
      '#type' => 'inline_template',
      '#template' => '{% trans %}my {{ foo }} here{% endtrans %}',
      '#context' => ['foo' => 'bar'],
    ];

    $my_string_with_embedded_themable = [
      '#type' => 'inline_template',
      '#template' => '{% trans %}Print this string and this subtemplate: {{ my_subtemplate }}.{% endtrans %}',
      '#context' => [
        'my_subtemplate' => $my_subtemplate,
      ],
    ];

The generated output is:

Print this string and this subtemplate: .

I've confirmed that my_subtemplate generates the correct output on its own:

my bar here

But when its placed into a variable of another inline template, it does not render.

Answer 1

The issue not in the inline_template but the issue comes from {% trans %} if you place a render array variable into {% trans %}{% endtrans %} you will get the following error and it will not rendered:

Warning: htmlspecialchars() expects parameter 1 to be string, array given in Drupal\Component\Utility\Html::escape()

So you have two options:

1) get the variable out of {% trans %}{% endtrans %} like the following:

    $my_subtemplate = [
      '#type'     => 'inline_template',
      '#template' => '{% trans %} my {{ foo }} here {% endtrans %}',
      '#context'  => [
        'foo' => 'bar'
      ],
    ];
    $my_string_with_embedded_themable = [
      '#type'     => 'inline_template',
      '#template' => '{% trans %} Print this string and this subtemplate: {% endtrans %} {{ my_subtemplate }} .',
      '#context'  => [
        'my_subtemplate' => $my_subtemplate,
      ],
    ];

2) Pre-render the renderable array variable to a string first.

    $my_subtemplate = [
      '#type'     => 'inline_template',
      '#template' => '{% trans %} my {{ foo }} here {% endtrans %}',
      '#context'  => [
        'foo' => 'bar'
      ],
    ];

    $renderer = \Drupal::service('renderer'); 
    $my_subtemplate = $renderer->renderRoot($my_subtemplate); // this fixes it

    $my_string_with_embedded_themable = [
      '#type'     => 'inline_template',
      '#template' => '{% trans %} Print this string and this subtemplate: {{ my_subtemplate }}.{% endtrans %}',
      '#context'  => [
        'my_subtemplate' => $my_subtemplate,
      ],
    ];

Answer 2

I like to also use inline_template, as a way to escape from the limitations of the drupal render arrays.

I would solve it with a single include to have templates as proper twig templates and not mixed with the logic (MVC approach + better syntax highlighting):

$my_string_with_embedded_themable = [
  '#type' => 'inline_template',
  '#template' => "{% include '@myTheme/path/my-template-file.html.twig' %}",
  '#context' => [
     'foo' => 'bar',
     'my_subtemplate' = 'my_subtemplate'
  ]
]

And then 'web/themes/myTheme/templates/path/my-template-file.html.twig':

<p>
{% trans %}Print this string and this subtemplate:{% endtrans %}
{% include '@myTheme/' ~ my_subtemplate %}.
</p>

The above example does not really require the include in the include, but the real approach is probably more complex anyway.

so 'web/themes/myTheme/templates/' + my_subtemplate:

{% trans %} my {{ foo }} here {% endtrans %}