ContainerView.pushObject()は、動的に追加されたビューをContainerオブジェクトと自動的に結び付けません。
ハンドルバー レンダー ヘルパーを含むテンプレートをビューがレンダリングするときに、オートワイヤー コンテナーがないと、レンダリング エラーが発生します。
機能するシンプルなケース (種類)
意見：
App.DynamicView = Em.View.extend({
templateName: 'dynamic',
didInsertElement: function() {
var control = this.get('controller');
control.send( 'view_inserted', this.templateName, control._debugContainerKey);
control.send('callDynamicController');
}
});
テンプレート：
<script type="text/x-handlebars" data-template-name="dynamic">
dynamic
</script>
コントローラー (手動で割り当てた場合のみ使用):
App.DynamicController = Em.ObjectController.extend({
className: 'App.DynamicWithRenderController',
callDynamicController: function() {
console.log('DynamicController.callDynamicController()');
}
});
インデックス コントローラ:
App.IndexController = Em.ObjectController.extend({
view_inserted: function(aview, acontroller) {
console.log('view inserted!', aview, acontroller);
}
})
インスタンス化コード:
var acontainer = App.DynamicController.create({});
var aview = App.DynamicView.create({ controller: acontroller })
acontainerView.pushObject(aview);
これらのクラスは期待どおりにレンダリング & 動作しますが、それらを調べると、Ember 配線の一部が欠けています (たとえば_debugContainerKey&containerプロパティ IIRC がありません):
壊れるより高度なケース
レンダリング ヘルパーを使用するハンドルバー テンプレートを導入すると、レンダリングが中断されます。現在、動的に追加されたビューには、レンダリング ヘルパーが想定するいくつかのプロパティがありません
<script type="text/x-handlebars" data-template-name="dynamic-with-render">
dynamic w/render:
{{render knob}}
</script>
ノブを次のようにします。
<script type="text/x-handlebars" data-template-name="knob">
{{render knob}}
</script>
(失敗した) 動的ビューのインスタンス化コード:
var acontainer = App.DynamicController.create({});
var aview = App.DynamicView.create({
controller: acontroller,
template:'dynamic-with-render' })
acontainerView.pushObject(aview);
コード例
いくつかのメモを含む完全な例をここで見ることができます:
http://jsfiddle.net/AshCoolman/KyJ2U/6/embedded/result/
注: 私のテストには、 controlWithVarsと呼ばれるコントロールヘルパーに基づくカスタム ハンドルバー ヘルパーが含まれています。
問題
次のいずれかで、Ember 配線を行うものを記述する必要があるようです。
- よりネイティブな ContainerView (Ember の内部に入り込む)、または
- より分離された新しいレンダー ヘルパーはおそらく洗練されていません)
どうすればよいかわかりません。誰かがすでにエレガントな解決策を考え出しているか、少なくとも役立つヒントを教えてくれれば幸いです。
編集:したがって、ビューの依存関係を含むコンテナーを作成して割り当てることが解決策になる可能性があるようです。誰か考えますか？
参考資料