烬-cli，砌筑，同位素，包装.如何使用

Question

我需要在ember-cli项目中使用它们。

如何开始?

我写在终端:

bower install isotope --save

然后在我的ember-cli-build.js我添加了app.import ecc...，但然后我不知道该怎么做。

放置初始化脚本的位置，如下所示:

$('.grid').isotope({
  // options
  itemSelector: '.grid-item',
  layoutMode: 'fitRows'
});

如果我把它放在应用程序。hbs它给我一个错误，当我用{{#link-to}}改变路由时，它不再工作了。

该怎么办?

在网络上没有很多关于这个的资源

Answer 1

你应该创建一个组件:

ember g component isotope-grid

然后，在组件的didInsertElement钩子中，你应该在组件的jQuery元素上调用isotope:

import Ember from 'ember';
export default Ember.Component.extend({
    classNames: ['grid'], 
    didInsertElement() {
      this.$().isotope({
        // options
        itemSelector: '.grid-item',
        layoutMode: 'fitRows'
      });
    }
})

然后，不使用<div class="grid"></div>，使用:

{{#isotope-grid}}
  ... HTML goes here
{{/isotope-grid}}