¿Cómo debo vincularme a una función de ventana en una Vista Ember?

Question

Tengo un mixin que recalcula automáticamente y establece el alto de un div en el cambio de tamaño de la página.

Funciona pero parece tonto a mí para ser la unión a un evento jQuery y activar un evento Ember manualmente cada vez que se llama.

¿Hay alguna manera de vincular los eventos de ventana directamente en Ember?

Tengo un jsFiddle simplificado here

Este es el código:

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') 
) 

Y el mixin que lo está llamando.

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) 

Answer 1

No hay nada de malo en registrar su propio controlador de eventos con jQuery para algo como esto.

Ember no tiene ningún evento de ventana actualmente.

También sugiero tratar de encontrar una solución que no dependa de los globales.

Answer 2

No creo que sea posible con Ember.js - el único lugar donde se proporciona construido en el manejo de eventos DOM es para Ember.View (click etc.) y tal vez en otras clases relacionadas con las vistas.

¡También utilizamos enfoques similares a su solución para manejar casos especiales como este!

Answer 3

Sé que voy un par de años de retraso, pero yo estaba buscando una solución para el mismo problema y encontré esto:

jQuery(window).on('resize', Ember.run.bind(this, this.handleResize)); 

(fuente: Ember.js ofiicial)

**** P. S. Acerca de la implementación de este pequeño truco - No sé si es posible usarlo en un método de controlador y desencadenar en init (como denis.peplin comentó), en realidad estoy vinculando el evento en la función 'setupController' de la ruta . No sé si es la mejor práctica, pero funciona como un encanto en mi aplicación.

Answer 4

y código de muestra para Itay Hamashmid 's respuesta:

App.ApplicationController = Ember.Controller.extend({ 
    handleResize: function() { 
    console.log('resized'); 
    }, 
    bindResizeEvent: function() { 
    jQuery(window).on('resize', Ember.run.bind(this, this.handleResize)); 
    }.on('init') 
});