添加和删除 Meteor 模板答案

【问题标题】：Adding and removing Meteor templates添加和删除 Meteor 模板
【发布时间】：2017-02-07 18:34:15
【问题描述】：

对于 Meteor 应用程序，我希望用户能够通过单击按钮将 div 添加到列中，每个按钮都有一个删除 div 的按钮。这是代码的摘录：

<template name="MainTemplate">
    ....
    <a class="btn btn-sm" class="add-dynamic"></a>
    <div id="add-stuff-here"></div>
    ....
</template>

<template name="DynamicTemplate">
   <div id="dynamic-{{uniqid}}">
       <a class="btn btn-sm delete-dynamic" name="{{uniqid}}"></a>
   </div>
</template>

...在 javascript 文件中：

Template.MainTemplate.events({
    'click .add-dynamic'(event) {
     const random = String.fromCharCode(65 + Math.floor(Math.random() * 26));
     const uniqid = random + Date.now();
     Blaze.renderWithData(Template.DynamicTemplate, {uniqid: uniqid}, $("#add-stuff-here")[0])
    },
})

Template.DynamicTemplate.events({
    'click .delete-dynamic'(event){
        const target = event.target || event.srcElement;
        const id  = target.id;
        console.log("Button ID: " + id); // This is null
        new = $('#dynamic-' + id);
        new.parentNode.removeChild(new); // Therefore, this fails
    }
});

添加模板按预期工作，但删除它们失败，因为单击按钮的 id 似乎为 nil。

无论如何，我可能会以完全错误的方式来解决这个问题（我已经很长时间没有使用 Meteor 并且无论如何也不太了解它），所以如果有任何关于如何实现的建议，我将不胜感激可能会实现。

ETA：cmets 中建议的可能答案包括：

UI.remove(self.view);

...“期望使用 Blaze.render 渲染的模板”。我无法确定如何将要删除的模板的身份传递给单击按钮时运行的函数 - 有人有什么建议吗？

【问题讨论】：

stackoverflow.com/questions/22907716/…的可能重复
不是重复的，但链接的问题可能对确定解决方案有价值。
我认为它直接回答了你的问题，试一试:)
我当然会试一试，虽然此时我正在酒吧喝酒，所以必须推迟测试。感谢您的链接。
不幸的是，我无法在该问题中找到任何能够帮助我解决上述具体问题的内容。我已经编辑了我的问题以提供更多详细信息。

标签： javascript meteor meteor-blaze

【解决方案1】：

最后我通过这样做解决了这个问题：

<template name="DynamicTemplate">
    <input type="text" class="dynamic-input" placeholder="Some text" />
</template>

Template.DynamicTemplate.events({
    'click .delete-dynamic'(event){
     inputs = $(".dynamic-input").length;
     if ( inputs > 1 ) {
        const element = $(".dynamic-input")[dynamic - 1];
        element.parentNode.removeChild(element);
        }
    }
});

这似乎或多或少地做了我所追求的，并避免了我在原帖中提到的空 ID 的问题。

【讨论】：