Question

我使用以下命令编译了一个哈巴狗模板 temp1.js 。

pug --client --no-debug temp1.pug

编译后的文件包含一个名为 template 的函数。我想知道如何在我的服务工作者中使用此文件。意味着如何调用此函数。有没有办法改变功能名称。

temp1.js

function template(locals) {var pug_html = "", pug_mixins = {}, pug_interp;pug_html = pug_html + "\u003C!DOCTYPE html\u003E\u003Chtml\u003E\u003Chead\u003E\u003Cmeta charset=\"utf-8\"\u003E\u003Cmeta http-equiv=\"content-language\" content=\"en\"\u003E\u003Cmeta name=\"viewport\" content=\"width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no\"\u003E\u003Cmeta name=\"format-detection\" content=\"telephone=no\"\u003E\u003C\u002Fhead\u003E\u003Cbody\u003E\u003Cdiv class=\"mfw pDDetail\" id=\"buyPage\" data-role=\"page\"\u003E\u003Cdiv class=\"mfw\"\u003E\u003C\u002Fdiv\u003E\u003Cdiv class=\"imgGal wd100 lf tc\"\u003E\u003Cdiv id=\"mobilePdGal\"\u003E\u003Cul active=\"0\" style=\"transform: translateX(0px)\"\u003E\u003Cli style=\"display:inline-block;position:relative\"\u003E\u003C\u002Fli\u003E\u003C\u002Ful\u003E\u003C\u002Fdiv\u003E\u003C\u002Fdiv\u003E\u003Cdiv class=\"firstFold dp\" id=\"pHeaderId\"\u003E\u003Cdiv class=\"price-n-project\"\u003E\u003C\u002Fdiv\u003E\u003C\u002Fdiv\u003E\u003C\u002Fdiv\u003E\u003C\u002Fbody\u003E\u003C\u002Fhtml\u003E";;return pug_html;}

Answer 1

要在您的网页中使用template功能包括temp1.js，请调用template()，这将呈现您可以附加到DOM的HTML字符串：

<script src="temp1.js"></script>
<script>

  var model = { templateName: 'Template 1' };
  var html = template(model);
  $('body').append(html);

</script>

我用于生成temp1.pug的{{1}}模板文件包含一个带有单个变量temp1.js的数据模型。您的templateName模板文件的数据模型可能包含多个变量，或者根本没有变量。

temp1.pug

模板功能名称

如果要在生成// temp1.pug p This is #{templateName}时更改模板函数名称，请使用temp1.js选项：

--name

然后，您可以致电pug --client --no-debug temp1.pug --name "myTemplate"在您的网页中呈现HTML。

示例：Pug Template Function

帕格模板引擎在服务工作者

1 个答案: