我正在尝试加载从Zurb Foundation框架(CSS / UI bootstrap)继承的Javascript,特别是handle "equalization" of cell heights in a grid。他们的库主要是CSS,它完全符合ember,但有些需要Javascript才能完成它的工作。
在我的应用程序中,我有路由器,路由,模型,控制器和模板。到目前为止,我还没有一个视图或组件(文档也没有说明他们应该使用的是什么)。
我的控制器/路由/模板中是否有办法检测特定模板是否已完成加载,并运行一些自定义Javascript?
我需要运行的自定义Javascript:
$(document).foundation()
// OR, for speed's sake a more limited reload:
$(document).foundation('equalizer', 'reflow');
答案 0 :(得分:1)
你需要等到ember将DOM添加到你要调用jQuery代码的页面上。
使用组件并在didInsertElement钩子中调用该函数。
像这样的东西。
equalizer: function(){
this.$().foundation('equalizer', 'reflow');
}.on('didInsertElement')
答案 1 :(得分:1)
didInsertElement
有时无法正常工作,尤其是如果您在form inputs
中展示了view
或{{#each}}
的嵌套视图。我建议你运行这样的东西
didInsertElement : function(){
this._super();
Ember.run.scheduleOnce('afterRender', this, this.afterRenderEvent);
},
afterRenderEvent : function(){
this.$(document).foundation('equalizer', 'reflow');
}
你甚至可以使它更通用,按照there的说明,我认为这是这种经常出现问题的最佳做法