私は Emberjs と Gridsterjs を使用して、ある種のエディターを作成しています。Emberjs に jQuery プラグインを含めるには、コンポーネントを作成する必要があることがわかりました。そのコンポーネント内には、Gridster のウィジェットになる多数のコンポーネントがあります。
これが私のテンプレートのセットアップ方法です:
<script type="text/x-handlebars">
{{#create-gridster}}
{{create-widget}}
{{/create-gridster}}
</script>
<script type="text/x-handlebars" data-template-name="components/create-gridster">
<button class="btn" {{action 'newWidget'}}>add widget.</button>
<section class="gridster-wrapper">
<div class="gridster">
<ul id="gridster-list">
{{yield}}
</ul>
</div>
</section>
</script>
これで、ユーザーがウィジェットを Gridster に追加できるようにするボタンを作成しましたが、コンポーネントからウィジェットに要求された HTML 文字列を与える方法を見つけることができません。
私はこれを試しました:
this.get('gridster').add_widget(Ember.Handlebars.compile('{{create-widget}}'));
この:
this.get('gridster').add_widget(App.CreateWidgetComponent.create().createElement());
しかし、それはうまくいきません。
質問
私の質問は、グリッドスターが期待する html 文字列を作成し、コンテンツを編集するための残り火機能を維持するにはどうすればよいかということです。