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

Question

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

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

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

我看for/startup格子的结果是这样的：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

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

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

How to include gridster.js into Ember application?

javascript

jquery

ember.js

gridster