4

更新：

看起来这个脚本可能是我正在寻找的催化剂。如果是这样，将对其进行测试并回答/关闭此问题。

我相信我最终会找到答案，但我现在把它放在那里，以防其他人马上知道......

我正在使用 RaphaelJS 来操作 DOM（将一堆SVG标签添加到已识别的 DOM 中DIV），如果 MongoDB 集合有更新，我想重新渲染那些特定的 DOM 部分。

举个例子：-假设我有一个名为PiePieces. -当页面第一次渲染/调用时，假设集合中的块数是 4。-我使用控制台以编程方式添加一个饼块：PiePieces.insert({...}) -我希望页面像标准把手绑定情况一样更新，但问题是，新条目需要通过执行直接 DOM 操作的 Raphael 脚本。

所以，逻辑会是这样的：

MongoDB 集合更新事件 -> 客户端函数调用来操作 DOM -> DOM 修改/页面更新而无需刷新。

我已经尝试通过从 DOM 本身读取值来实现这一点，并且我可以获得更新的 DOM，但是整个页面会刷新和/或我必须手动刷新页面，或者 DOM 树尚未完成，等等在我刷新之前它是空白的。

你能指出我正确的方向吗，也许是一个小代码片段/例子？（如果已经存在类似的东西，请告诉我在哪里，我会去挖掘）

提前致谢！（到目前为止，我很喜欢 Meteor ......）

4

2 回答 2

4

也许你想要观察方法。您可以将回调分配给您所谓的“MongoDB 集合更新事件”，然后调用使用 Raphaël 或其他方式的 DOM 操作函数。

它看起来像这样：

PiePieces.find().observe({
    changed: function(piePiece) {
        //call DOM manipulating function
    }
})

这会将回调附加到所有 PiePieces。如果您不想将回调附加到所有文档，请在观察之前在 find 上查询您想要的那些。

于 2012-11-26T17:02:09.237 回答
0

您可以像这样从模板内部引用 draw 方法：

模板.html

<template name="drawing">
  {{#each PiePieces}}
     {{draw piece}} <!-- assuming 'piece' is a property on 'PiePiece' -->
  {{/each}}
</template>

客户端.js

Template.drawing.PiePieces = function(){
  PiePieces.find();
}

Template.drawing.draw = function(piece){
  // your drawing method here
}
于 2012-04-23T17:47:25.473 回答