Javascript 使用节点js在div中追加Ejs模板文件

我有两个ejs文件。我需要根据标签单击添加模板

这里我添加了index.ejs模板代码

<!--- Header content----->
<div class="btn-group filter-suggestions" data-toggle="buttons" style="margin-left:25px;">
    <label class="btn btn-default active" data-tab="tab1">
        <input type="radio"  name="suggest" value="1" />
        Tab1 </label>
    <label class="btn btn-default" data-tab="tab2">
        <input type="radio"  name="suggest" value="2" />
        Tab2 </label>
</div>
<div class="tabcontent"> TabContent</div>
<!-----------Content--------->
<!-----------Footer--------->

<div> Tab1 content</div>

<div> Tab2 content </div>

---

它不起作用。有没有想过使用节点js附加ejs模板？

ejs不会这样解析。按照代码当前的方式，您正在将templatename设置为“/templates/Tab1.ejs”或“/templates/Tab2.ejs”的字符串值，它不会读取您指定的.ejs文件的内容

更简单的方法是加载两个选项卡，并在默认情况下隐藏其中一个或两个选项卡，然后根据标签单击显示所需的选项卡

以下是一些可供选择的代码：

// Hide the tabs
$('#idoftab1, #idoftab2).hide();

$('.filter-suggestions label').on('click', function() {
    //get the tab attribute type
    var type = $(this).attr(tab);

    if(type == tab1){
        $('#idoftab1').show();
    } else {
       $('#idoftab2').show();
    }
});

---

如果您正在寻找一种更具编程性的方法，通过客户端模板来实现这一点，那么您可以考虑使用AngularJS或甚至类似的库，但实际上，对于您想要实现的目标来说，这种更改可能过于苛刻。

将它们包含在索引中，并使用js显示/隐藏。

// Hide the tabs
$('#idoftab1, #idoftab2).hide();

$('.filter-suggestions label').on('click', function() {
    //get the tab attribute type
    var type = $(this).attr(tab);

    if(type == tab1){
        $('#idoftab1').show();
    } else {
       $('#idoftab2').show();
    }
});