javascript - 如何将 gridster.js 包含到 Ember 应用程序中？

Question

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

现在我尝试在 View 中包含 JS 和 CSS 文件。

在 ember 应用程序中使用 Gridster 的最佳方式/方法是什么？

我寻找/启动网格的结果是这样的: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 正在转向组件并远离 View ，因此这里是将 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

此外，为了使它更有用，您可能需要阅读组件内部的 {{ yield }} 用法 here