繁体   English   中英

如何在pug文件中内插包含pug代码的字符串?

[英]How to interpolate a string containing pug code within a pug file?

我需要在一个pug文件中插入一个包含一些pug格式代码的字符串。

我测试了什么:

- var text = "i.home.icon"

div= text
div !{text}
div #{text}
div ${${text}}
div {{text}}
div {text}
div \#{text}
div \{text}
div ${text}
div
    #{text}

我想要的是 :

<div><i class="home icon"><i></div>

您可以使用mixin做到这一点。 这里是一个代码笔 ,显示了它在实际示例中的工作方式。

mixin tagCreator(def)
  - var tagArray = def.split('.');
  - var tag= tagArray[0];
  - tagArray.shift();
  - var classes = tagArray.join(' ');
  |<#{tag} class='#{classes}'>
  if block
    block
  |</#{tag}>

+tagCreator('one')
+tagCreator('two.three.four') Two

上面的代码创建以下HTML:

<one class=""></one>
<two class="three four">Two</two>

逐行快速解释其作用:

  1. 将以句点分隔的字符串拆分为一个数组
  2. 分别存储标签名称
  3. 删除数组中的第一个元素
  4. 将数组的其余部分连接到一个以空格分隔的字符串中,该字符串适合class=""输出
  5. 使用管道定界符输出带有类的纯文本标签
  6. 输出添加到标签的所有内容(如果存在)
  7. 再次使用纯文本关闭标签

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM