10

ページのサイズ変更時に div の高さを自動的に再計算して設定する mixin があります。

それは機能しますが、jQuery イベントにバインドし、Ember イベントが呼び出されるたびに手動でトリガーするのはばかげているように思えます。

Ember でウィンドウ イベントに直接バインドする方法はありますか?

ここに単純化された JSFiddle があります

これはコードです：

App.windowWrapper = Ember.Object.create(Ember.Evented,
  resizeTimer: null
  init: ->
    @_super()
    object = this
    $(window).on 'resize', ->
      window.clearTimeout(object.resizeTimer)
      object.resizeTimer = setTimeout( App.windowWrapper.resize, 100)
      true

  resize: ->
    App.windowWrapper.fire('resize')
)

そして、それを呼び出しているミックスイン。

App.Scrollable = Ember.Mixin.create
  classNames: "scrollable"
  init: ->
    Ember.assert("Scrollable must be mixed in to a View", this instanceof Ember.View)
    @_super()

  didInsertElement: ->
    @_super()
    @calculateHeight()
    App.windowWrapper.on('resize', this, 'calculateHeight')

  willDestroyElement: ->
    App.windowWrapper.off('resize', this, 'calculateHeight')
    @_super()

  calculateHeight: ->
    offset       = @$().offset().top
    windowHeight = $(window).height()
    @$().css('height', windowHeight - offset)
4

5 に答える 5

8

このような場合、独自のイベント ハンドラーを jQuery に登録しても問題はありません。

Ember には現在、ウィンドウ イベント処理がありません。

また、グローバルに依存しないソリューションを考え出すことをお勧めします。

于 2012-06-02T23:22:27.827 に答える
3

Itay Hamashmidさんの回答のサンプル コード:

App.ApplicationController = Ember.Controller.extend({
  handleResize: function() {
    console.log('resized');
  },
  bindResizeEvent: function() {
    jQuery(window).on('resize', Ember.run.bind(this, this.handleResize));
  }.on('init')
});
于 2014-11-07T06:45:39.103 に答える
0

Ember.js では可能だとは思いません。ビルトイン DOM イベント処理を提供する唯一の場所は、Ember.View (クリックなど) と、おそらく他のビュー関連クラスです。

また、このような特殊なケースを処理するために、ソリューションに同様のアプローチを使用しました!

于 2012-06-02T23:16:07.607 に答える