Renderizar texto sem formatação como HTML no Drupal 8 galho


16

Corri para uma parede tentando renderizar um código de marcação de imagem svg em html a partir de um campo de texto sem formatação.

Eu estou olhando para processar o código svg a partir de um campo de texto simples sem substituir a renderização do campo de texto sem formatação em qualquer outro lugar.

O formato de texto sem formatação atualmente converte todas as tags html e <> para &lt; &gt; .

Criei um modelo de campo e tentei produzir o conteúdo do campo como

{{ item.content.context.value }}

e

{{ item.content|raw }}

ambos processam o valor como sequência, envolvendo todas as linhas com "aspas" e convertendo quebras de linha em <br/>tags.

Eu já tinha o texto formatado do tipo de campo, mas isso também envolvia tudo em <pre>tags, mesmo quando todas as tags eram permitidas. Eu realmente gostaria de fazê-lo funcionar com texto simples.

Exemplo do código svg que o campo deve conter no formato de texto:

<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
         viewBox="0 0 290 290" enable-background="new 0 0 290 290" xml:space="preserve">
    <g>
        <path fill="none" stroke="#78C681" stroke-width="3" stroke-miterlimit="10" d="M261.1,273.1H28.9c-6.6,0-12-5.4-12-12V28.9
            c0-6.6,5.4-12,12-12h232.1c6.6,0,12,5.4,12,12v232.1C273.1,267.7,267.7,273.1,261.1,273.1z"/>
        <circle fill="none" stroke="#1B435D" stroke-width="2" stroke-miterlimit="10" cx="145.2" cy="166.9" r="62.7"/>
        <line fill="none" stroke="#78C681" stroke-width="3" stroke-miterlimit="10" x1="16.9" y1="60.8" x2="273.1" y2="60.8"/>
        <circle fill="none" stroke="#1B435D" stroke-width="2" stroke-miterlimit="10" cx="178.3" cy="152.3" r="6.8"/>
        <path fill="none" stroke="#1B435D" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" d="M115.1,167.9
            c8.8,0,22.3,3.2,28.4,4.7"/>
        <path fill="none" stroke="#1B435D" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" d="M151.9,216.9
            c0,0,17.2-1.5,29.6-14.8"/>
    </g>
</svg>

Espero que alguém possa ajudar.

melhor,

Alari


O texto simples pronto para uso possui um filtro que escapa à marcação. |rawnão desescapa já escapou da marcação. A fuga está acontecendo antes da fuga automática de Twig.
Cottser

Respostas:


17

Uma solução da iworkyon da comunidade Drupal:

campo - nó - [nome do campo] .html.twig:

{% if svg %}
  <div class="my-svg">
    {{ svg|raw }}
  </div>
{% endif %}

THEME.info:

/**
* Implements hook_preprocess_field().
*/
function MYTHEME_preprocess_field(&$variables, $hook) {
    switch ($variables['element']['#field_name']) {
      case 'field_svg_test':
        $variables['svg'] = $variables['items'][0]['content']['#context']['value'];
        break;
    }
}

Hehe, parece que o meu apelido do IRC "Estou no trabalho" apareceu aqui: D Descoberta divertida enquanto pesquisava no Google!
ividyon

Espero que você não se importe :) Isso me ajudou, então pensei em compartilhar.
Alari Truuts

7

Você tentou aplicar o filtro não processado no valor?

{{ item.content.context.value|raw }}

Mas isso não é seguro. Para gerar arquivos, você pode usar um campo de arquivo. Este possui os formatadores de campo corretos para gerar o link. Se você não conseguir configurar o link na interface do usuário de acordo com suas necessidades, poderá modificar o galho ou o pré-processo para esse campo específico.


rawestá sendo / foi removido: drupal.org/node/2603074
Clive

4k4: O campo é um campo de texto sem formatação e não um arquivo. O valor do campo será a marcação copiada de uma imagem svg. Eu tentei sua solução, mas nada é diferente, ainda recebo o problema de quebra de linha e quebra de linha. Agora também estou preocupado em usar o | raw após o que Clive disse e estou ainda mais longe de encontrar uma solução.
Alari Truuts

Você está ainda mais longe de encontrar uma solução, porque tenta enganar o escapamento automático e o drupal tenta de tudo para desencorajá-lo a fazer isso. Melhor usar o mecanismo existente para fornecer links de arquivos, conforme descrito na minha resposta. E, em seguida, use os modelos de galhos apropriados na linha para alterar a renderização.
4k4

4k4: Estou um pouco confuso agora, pois o conteúdo que o campo precisa conter não é um arquivo. está na forma de texto / código-svg. Eu atualizei a pergunta com um exemplo.
Alari Truuts

O texto sem formatação não poderá gerar esse código svg. Você tentou o formato de texto "Full Html", se isso pode processar o código svg? Caso contrário, é melhor colocar o svg em seu próprio arquivo svg.
4k4

6

Isso funcionou para mim:

{{ item.content['#context'].value|raw }}
Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.