Question

我正在尝试使用ember-cli创建的应用程序中使用同位素库; 我创建了一个激活它的组件：

export default Ember.Component.extend({
    didInsertElement: function() {
        Ember.run.next(this, function(){
            var $container = $('#container');
            // init
            $('#container').isotope({
                // options
                itemSelector: '.item',
                layoutMode: 'fitRows'
            });
        });
    }
});

运行这个我得到一个错误，相对于同位素调用，“undefined不是一个函数”。

尝试在ember-cli之外复制此错误，我发现在jquery之前包含同位素脚本时会发生这种情况;

在ember-cli中我使用Brocfile中的app.import导入同位素脚本：

app.import('bower_components/isotope/dist/isotope.pkgd.js');

有人使用ember-cli成功使用jquery Isotope吗？

Answer 1

我知道这是旧的，但我会添加它，所以也许它可以帮助别人......

通过凉亭安装

    bower install isotope --save

或通过npm

    npm install isotope-layout

将其添加到ember-cli-build.js文件

    app.import('bower_components/isotope/dist/isotope.pkgd.min.js');

创建新组件

    ember g component isotope-grid

将其添加到Component.extend

中的component.js

classNames: ['isotope-grid'],

didInsertElement() {
  this.$().isotope({
    itemSelector: 'li',
    layoutMode: 'fitRows'
  });
}

现在，只要网格是具有一类同位素网格的ul，就应该开展业务。

使用带有ember-cli的jquery同位素库

1 个答案: