添加和删除模板

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来更新模型，但我真的只想从视图中删除它们，因为我希望默认模型始终保持不变。

那么，当用户单击添加内容并删除用户单击删除时的特定视图时，如何删除并向视图添加模板？有没有Meteor的方式来做到这一点？因此，用户点击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 }); 
    } 
});