如何將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 
    }); 
}