动画Ember集合分页

Question

我们正在构建一个成员分页库，该库将帮助程序员对数组集合中的项进行分页。到目前为止，我们设法放置了所有内容，进行了分页，还添加了一个typeahead来帮助搜索，但我们想知道，当我们在Ember.js 中应用一些过滤器或进行分页时，是否有一种方法可以对项目进行动画化。

Answer 1

当然。可能最简单的方法是从一些动画库（如velocity）创建一个块组件，将其包裹在分页项周围。让组件使用一个jQuery选择器，它表示一个单独的分页项，然后用选择器实例化动画插件。您可以执行.observes('content')，并在内容更改时重新发送组件。这里有一个简单的例子：

App.MyAnimationComponent = Ember.Component.extend({
    didInsertElement: function () {
        var selector = this.get('selector');
        this.$(selector).animateLibrary({ options: 'foo' });
    },
    fireOnNewContent: function() {
        this.rerender();
    }.observes('content')
});

你会这样使用：

{{#my-animation selector='.item'}}
    {{#each items}}
        <div class="item">{{foo}}</div>
    {{/each}}
{{/my-animation}}