J'ai un mixin qui recalcule automatiquement et définit la hauteur d'une DIV sur la page redimensionnement.
Cela fonctionne, mais cela me semble idiot pour être liant à un événement de jQuery et déclencher un événement Ember chaque fois qu'il est appelé . P>
Y a-t-il un moyen de se lier aux événements de la fenêtre directement dans Ember? P>
J'ai un jsfiddle simplifié ici p>
ceci est le code: p> et le mixin qui l'appelle. P > 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)
5 Réponses :
Je ne pense pas que ce soit possible avec Ember.js - Le seul endroit où il propose une manipulation des événements DOM intégrée est pour Ember.View (click, etc.) et peut-être dans d'autres classes liées à la vue.
Nous avons également utilisé des approches similaires de votre solution pour gérer des cas spéciaux comme celui-ci!
Il n'y a rien de mal à enregistrer votre propre gestionnaire d'événements avec jQuery pour quelque chose comme ça.
Ember n'a pas de manipulation d'événements de fenêtre Actuellement.
Je suggérais également d'essayer de trouver une solution qui ne comptait pas sur les globaux.
Je sais que je suis quelques années de retard, mais je cherchais une solution au même problème et j'ai trouvé ceci: (source: ember.js Ofiicial ) **** ps
À propos de la mise en œuvre de cette petite astuce - je ne sais pas s'il est possible de l'utiliser dans une méthode de contrôleur et de déclencher l'init (comme Denis.peplin commenté), je lie réellement l'événement dans la fonction "SetupController" de la route. Je ne sais pas si c'est la meilleure pratique, mais cela fonctionne comme un charme dans mon application.
Oui, et comment vous l'aborde une fois que vous l'avez tenu ...?
et exemple de code pour itay hamashmide s réponse:
Denis.Peplin: La fonction BindResizeVeventement est appelée init, mais lorsque je modifie la taille du navigateur chrome, la fonction ne fonctionne pas à nouveau. Le comportement attendu de BindResizeEvent est qu'il fonctionnerait chaque fois que la fenêtre du navigateur est redimensionnée (c'est ce que je recherche)?
Oui, et comment vous l'aborde une fois que vous l'avez tenu ...?
Pour ceux qui recherchent des réponses les plus récentes ou se débarrassent de JQuery ...
Dans mon cas, je veux juste savoir si la fenêtre a redimensionnée pour calcaire largeur de l'élément. P>
import Component from '@ember/component';
import $ from 'jquery';
export default Component.extend({
size: window.innerWidth,
init() {
this._super(...arguments);
$(document.querySelector('#something'))
.on('resize', (e)=> this.set('size', e.target.innerWidth));
}
});
Vous n'auriez pas besoin de l'objet
= ceci si vous avez utilisé une flèche graisse (=> ) lors de l'enregistrement de votre gestionnaire d'événements.