传递HTML字符串来渲染代码片段

我frontMatter静态生成HTML字符串的例子一样Metalsmith或HEXO这样的：传递HTML字符串来渲染代码片段

html: 
    code: "<a class=\"button-social\" href=\"#\">\n <div class=\"button-social__icon\"><i class=\"fa fa-dashboard\"></i></div>\n <div class=\"button-social__network\">Button</div>\n</a>" 
    copy: "<a class=\"button-social\" href=\"#\">\n <div class=\"button-social__icon\"><i class=\"fa fa-dashboard\"></i></div>\n <div class=\"button-social__network\">Button</div>\n</a>" 
    snippet: "<pre><code class=\"lang-html\">&lt;a class=&quot;button-social&quot; href=&quot;#&quot;&gt;\n &lt;div class=&quot;button-social__icon&quot;&gt;&lt;i class=&quot;fa fa-dashboard&quot;&gt;&lt;/i&gt;&lt;/div&gt;\n &lt;div class=&quot;button-social__network&quot;&gt;Button&lt;/div&gt;\n&lt;/a&gt;\n</code></pre>\n" 
    source: "<a href=\"#\" class=\"button-social\">\n <div class=\"button-social__icon\">\n <i class=\"fa fa-dashboard\"></i>\n </div>\n <div class=\"button-social__network\">\n Button\n </div>\n</a>"

我想提出html.snippet或html.code我的页面中显示的代码片段，但我得到了一切内嵌。

所以我最后的渲染是：

<a class="button-social" href="#"> <div class="button-social__icon"><i class="fa fa-dashboard"></i></div> <div class="button-social__network">Button</div> </a>

相反的：

<a class="button-social" href="#"> 
    <div class="button-social__icon"><i class="fa fa-dashboard"></i></div> 
    <div class="button-social__network">Button</div> 
</a>

我的枝条模板只是这个和代码将与PrismJS予以强调：

<div class="snippet-code" id="sn1"> 
    <pre class="lang-html"><code>{{ html.code|raw }}</code></pre> 
</div>

它似乎由于某种原因我放弃了换行符，这就是源代码的样子：

<pre><code class="lang-html"><a class="button-social" href="#"> <div class="button-social__icon"><i class="fa fa-dashboard"></i></div> <div class="button-social__network">Button</div> </a></code></pre>

我怎样才能避免宽松换行符看到代码与它的缩进？

来源

2017-03-01 vitto

你也试过：'{{html.code | raw | nl2br}}'？ –

你可以尝试new line 2 break filter这样的：

<div class="snippet-code" id="sn2"> 
    <pre class="lang-html"> 
    <code> 
    {{ html.snippet|raw|nl2br }} 
    </code> 
    </pre> 
</div>

但插入<br/>标签。我不确定这是否适合你？

来源

2017-03-01 16:29:01

我试过了，但并没有消除这个问题，也许我错过了一些东西来保持换行符？ – vitto

我更新了我的帖子。尝试添加'raw'过滤器，并且我认为它需要'html.snippet'。另外，您是否通过运行清除了缓存：'php bin/console cache：clear --env = prod'？ –

由于某种原因，我似乎失去了新行，我更新了这个问题 – vitto

传递HTML字符串来渲染代码片段

回答

相关问题