Question

我尝试在我的Ember应用程序中包含一个gridster脚本。在github上有一个ember-gridster组件，但不能再下载了。

现在我试图在视图中包含JS和CSS文件。

将Gridster用于ember应用程序的最佳方法/方法是什么？

我正在寻找/启动网格的结果如下：http://jsfiddle.net/h9f63/22/

有人可以解释如何在ember中达到这个结果。

export default Ember.View.extend({  
  didInsertElement:
  var gridster;
  $(function(){
    gridster = $(".gridster ul").gridster({
      widget_base_dimensions: [100, 55],
      widget_margins: [5, 5],
      helper: 'clone',
      resize: {
        enabled: true,
        max_size: [4, 4],
        min_size: [1, 1]
      }
    }).data('gridster');
  });
});

Answer 1

我相信Ember正朝向组件而远离视图，所以这里是将gridster简单地集成到Ember中，产生了一个gridster组件：

App.XGridsterComponent = Ember.Component.extend({
  tagname: "",

  didInsertElement: function(){
    Ember.$(".gridster ul").gridster({
      widget_base_dimensions: [100, 55],
      widget_margins: [5, 5],
      helper: 'clone',
      resize: {
        enabled: true,
        max_size: [4, 4],
        min_size: [1, 1]
      }
    }).data('gridster');
  }
});

使用jsbin here

另外，为了使这更有用，您可能希望了解组件here内的{{ yield }}用法

如何将gridster.js包含在Ember应用程序中？

1 个答案: