在新数据到达Meteor时动画化

use*_*697 5 styling mongodb angularjs meteor angular-meteor

我是meteor和minimongo的新手,所以我有点迷失了做什么,我已经做了研究,但由于我使用的是角+流星而不是火焰,所以找不到太多.

我的服务器上有一个在我的客户端订阅的集合(有角度).每次将新元素添加到我的服务器集合时,客户端会同步并更新minimongo并且它正常工作.

现在我想设置这个新的"事件",例如当一个新元素被添加到mongo数据的表(html)中的集合中时添加动画/渐变背景颜色(通过ng-repeat对辅助进行迭代)但是真的找不到办法做到这一点.

我已经找到了游标,它可能会成功,但我无法弄清楚我应该如何在我的角度前端实现它.

有人试过已经或可能指出我的研究方向吗?

谢谢

Vla*_*iev 1

你是对的 - 光标可能会起作用。还有observeChanges特别的方法。由于您只要求为您指明方向,而且我对 Anguler 不熟悉,因此我不提供完整的代码,仅提供一些建议:

  1. 使用文档的 ID 填充表格行元素,以便稍后能够访问它。( <tr class="..." data-id="q1w2e3r4t5">...</tr>)
  2. 然后,您可以将观察者附加到光标,并将 CSS 类添加到新添加的元素:cursor.observeChanges({added: (id) => $('[data-id=${id}]').addClass('animate')})
  3. 要启用动画,请在 CSS 中的某个位置定义.animate您喜欢的任何动画。您可以在其他有关此问题的 SO 帖子中找到帮助。它可能就像 fe

    @keyframes highlight { from {background-color: yellow;} to {background-color: white;} } .animate { animation: highlight 1s; }

希望对你有帮助。