0

我有一个名为“日志”的集合。在应用程序的整个生命周期中，日志会反复填充，例如：

12:15 - User xyz doing something
12:13 - Server doing something
12:12 - Server starts

... ETC

这是一个简单的发布/订阅机制，没有添加任何内容。模板只是循环遍历集合的每个元素并根据需要对其进行格式化。每行都在一个 div 中，以便于造型。

我想添加一个淡入淡出效果。我尝试向 div 添加一个淡入淡出（来自 boostrap），它适用于每次集合更改时的所有元素，也就是说，Meteor 似乎重新渲染了整个模板，而不是“添加”一个新元素到 div 列表。

有没有办法在流星中做到这一点？

谢谢

4

2 回答 2

1

我讨厌回答我自己的问题，但解决方案如下。我希望它可以帮助某人：

在车把中：

<div id="{{_id}}" class="logItem fade-class">
  <span>{{logItem}}</span>
</div>

在 Template.js 中：

Template.myTemplate.preserve({
  '.item[id]': function (node) { return node.id; }
});

瞧！

于 2013-07-31T14:33:00.510 回答
0

Meteor 重新渲染模板，但保留了 DOM 元素。你只需要标记它们，这样你就不会再次触发淡入淡出：

Template.list.rendered = function() {
    _.each(this.findAll('.item'), function(element) {
        if($(element).data('faded')) return;
        $(element).data('faded', true);

        $(element).fadeIn(); // Or whatever you like here
    });
};
于 2013-07-31T07:35:23.027 回答