添加和删​​除模板

Question

假设我有这个“模型”

 var lists = [
  {

    title:          'Default title',
    image:          '/img/default.jpeg',
    section:        [
                      {   name: 'Default Name',
                          description: 'Default Description'
                      }
                    ],
    activity:       ['default']
  }
];

这里是视图模板

<template name="main_list_view">
   {{#each list.section}}
      {{> section}}
   {{/each}}
   <a id="addSection" href='#'>Add Section</a>
</template>

<template name="section">
   <li>{{section.name}}</li>
   <li>{{section.description}}</li>
   <a class="deleteSection" href='#'>Delete Section</a>
</template>

我需要有关添加更多部分和从集合中删除特定部分的逻辑方面的帮助。

我已经检查了 mongoDB，看起来我必须使用 addToset 和 $unset 之类的东西来更新模型，但我真的只想从视图中删除它们，因为我希望默认模型始终保持不变。

那么当用户单击 Addcontent 时，如何将模板删除并添加到视图中，并在用户单击 remove 时删除特定视图？有流星的方法吗？因此，用户单击 addContent，如果单击删除，则会呈现或删除新的部分模板。

Answer 1

删除一个应该很简单。首先，在删除链接中添加部分的 id 可能会有所帮助：

<a data-id="{{section._id}}" class="deleteSection" href='#'>Delete Section</a>

Template.section.events({
  'click a.deleteSection': function(evt) {
    Sections.remove($(evt.target).data('id'));
  }
});

添加一个是另一回事，因为这完全取决于您单击addSection 链接时想要发生的事情。该链接是否呈现一个在提交时创建新Section 的表单？或者该链接的处理程序是否创建一个Section 对象并填写值？

编辑

有人指出Sections 不是一个集合。我应该看到的。将其制成一个集合将是处理该问题的明显方法。所以而不是：

   {{#each list.section}}
      {{> section}}
   {{/each}}

你会有：

{{#each sections list._id}}
  {{> section}}
{{/each}}

在你的 js 文件中：

Template.main_list_view.helpers({
  sections: function(list_id) {
    return Sections.find({ list_id: list_id });
  }
});

或者，您可以将“部分”模板向上移动到父级，然后您可以将 list_id 作为数据属性添加到链接上::

{{#each list.section}}
  <li>{{name}}</li>
  <li>{{description}}</li>
  <a data-id="{{list._id}}" data-name="{{name}}" data-description="{{description}}" class="deleteSection" href="#">Delete Section</a>
{{/each}}

然后在你的js文件中：

Template.section.events({
  'click a.deleteSection': function(evt) {
    var list = Lists.find($(evt.target).data('id'));
    var section = { name: $(evt.target).data('name'), description: $(evt.target).data('description') };
    sections = list.sections;
    sections.splice(sections.indexOf(section), 1);
    Lists.update(list._id, $set: { sections: sections });
  }
});