我正在使用meteor创建一个简单的数据输入和可视化应用程序。当我尝试使用jQuery根据数据更改每个条目的某些css时,我遇到了问题。
我进行了设置,以便在添加条目时(使用cursor.observe)计算高度值,然后使用jQuery将该值应用于css,但实际上并没有这样做。我知道值正在正确计算,因为我正在使用控制台来显示它们。
这是因为在此代码运行时,尚未从模板构建这些条目的实际html吗?如果是这种情况,我可以在哪里粘贴这些代码,以便在html出现后运行jQuery?
以下是与此问题相关的代码,我们将不胜感激。
Template.mainPanel.Actions = function(){
var actions = Actions.find()
actions.observe({
added: function(action){
var entryHeight = action.Duration
console.log("entryHeight: " + entryHeight)
$('#vis' + action.ID).css({'height':entryHeight})
}
})
return actions
}
答案 0 :(得分:2)
我假设您的应用中有一些代码,如:
<template name="mainPanel">
{{#each Actions}}
<div id="{{ID}}">Something</div>
{{/each}}
</template>
您正在配对从Template.mainPanel.Actions返回您的操作光标。
您可以直接在HTML中为样式添加反应式把手,而不是做一些复杂的观察,如下所示:
<template name="mainPanel">
{{#each Actions}}
<div id="{{ID}}" style="height: {{Duration}}px">Something</div>
{{/each}}
</template>