文章/答案/技术大牛

发布

问在handlebars.js中重用组件
EN

Stack Overflow用户

提问于 2020-07-24 17:14:02

回答 1查看 590关注 0票数 0

我正在尝试为我的网站的不同网页创建可重用的组件。我开始使用handlebars.js，我现在有下面的代码，我能够传递简单的超文本标记语言代码，并将其显示在网页上。但我希望有一个完整的导航栏组件，而不是渲染，最好是从另一个html或handlebar文件链接。有什么想法吗？

<head>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/4.7.6/handlebars.js"></script>
</head>
<body>
    <script id="template" type="template/handlebars">
        <h1> my website </h1>
        {{>navigationBar}}
    </script>
    <script>
         var partialSrc = "some link to navbar";
         Handlebars.registerPartial("navigationBar",partialSrc);
     var templateSrc = document.getElementById("template").innerHTML;
     var template = Handlebars.compile(templateSrc);
     document.body.innerHTML += template();
    </script>
</body>

mustache

javascript

html

layout

handlebars.js

回答 1

Stack Overflow用户

发布于 2020-07-24 20:35:24

将模板作为字符串写入外部JS文件的变量中，然后单独加载它，您认为如何？

template.js

var templateSrc = '<h1> my website </h1>\
    {{>navigationBar}}';

index.html

<body>
<script src="template.js"></script>
<script type="text/javascript">
  var partialSrc = "some link to navbar";
  Handlebars.registerPartial("navigationBar",partialSrc);
  let template = Handlebars.compile(templateSrc);
  document.body.innerHTML += template();
</script>
</body>

这是一个简化的演示文稿。当然，您必须确保在使用handlebars进行编译之前已经加载了template.js。

How do I include a JavaScript file in another JavaScript file?

票数 -1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/63070546

复制

相似问题

问在handlebars.js中重用组件
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问在handlebars.js中重用组件EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问在handlebars.js中重用组件
EN