如何将DOM属性与Mongo Collection中的每个项目相关联

Question

如何将一些HTML属性提供给Meteor中的Mongo Collection中的每个项目？我的使用情况是：

• 我的文档集合
• 我想显示他们每个人
• 在模板上的拇指（PDF文件），每个文件是一个article.document这是绝对定位
• 我要为 “顶” 和 “左” 每个article.document

我的代码分配的Math.random（）值：http://meteorpad.com/pad/bq6Ph5CQXMMejFQiF/DocumentList

文档list.html：

<template name="documentList"> 
    {{#each documents}} 
     <article class="document {{#if active}}active{{/if}}"> 
     <header class="document-header"> 
      <div class="document-avatar btn-floating lighten-3"></div> 
     </header> 
     </article> 
    {{/each}} 
</template> 

文档list.js：

Template.documentList.helpers({ 
    documents: function() { 
    return Documents.find({}); 
    } 
}); 

我的疑问是：我应该在哪里做计算的article.document元素时的随机值我应该将值分配给DOM节点。

谢谢！

Answer 1

首先，你应该分离出的文档模板：

<template name="documentList"> 
    {{#each documents}} 
     {{> document}} 
    {{/each}} 
</template> 

<template name="document"> 
    <article class="document {{#if active}}active{{/if}}"> 
    <header class="document-header"> 
     <div class="document-avatar btn-floating lighten-3"></div> 
    </header> 
    </article> 
</template> 

现在你可以创建一个渲染功能将被称为该已呈现到DOM每个文档：

Template.document.rendered = function() { 

    var $article = $(this.find('article')); 

    // Add the position attributes etc. using JQuery 

    $article.css({ 
    position: "absolute", 
    top: 10, left: 10 
    }); 
}