訂閱Ember應用程序中的DOM事件

我有一個基於Ember CLI的博客。我目前在使用應用程序控制器內的這個功能單擊它們時調整了所有<img>的帖子。訂閱Ember應用程序中的DOM事件

我依靠on('init')和Ember.run.later，這感覺很髒。

如何改進以下訂閱代碼？

import Ember from 'ember'; 

export default Ember.ArrayController.extend({ 
    imageScaling: function() { 
    Ember.run.later((function() { 
     //Subscribe to the actual event 
     Ember.$(".post-content img").on("click", function(){ 
     // RESIZE HERE 
     }) 
    }), 3000) 
    }.on('init') 
});

來源

2015-04-01 Hedge

如果要插入的所有內部灰燼模板您的圖片，你可以隨時使用action幫手：

<img {{action 'scaleImages' on='click'}} src='' />

我意識到這可能並非如此，雖然。我過去處理DOM交互的方式是覆蓋應用程序視圖，然後在那裏設置並拆除我的事件處理程序。您還可以通過修改jQuery事件偵聽器來避免調用Ember.run.later。這是我會怎麼做：

// app/views/application.js 
export default Ember.View.extend({ 
    setupImageScaling: function() { 
     $('body').on('click.image-scaling', 'img', function() { 
      // RESIZE HERE 
     }); 
    }.on('didInsertElement'), 

    teardownImageScaling: function() { 
     $('body').off('click.image-sacling'); 
    }.on('willDestroyElement') 
});

在我看來，以上是處理這種情況的「最灰燼」的方式。

來源

2015-04-01 14:18:19 GJK

感謝您的解決方案。我希望有更多的Ember-ish方式來處理這個問題:( – Hedge 2015-04-01 16:07:49

Ember在處理東西的時候可以做很棒的事情，當你讓Ember處理_everything_。當你做Ember之外的事情時（比如在不使用Ember模板的情況下將圖片插入到DOM中），事情開始變得不那麼漂亮了，幸運的是，你不應該經常這樣做。 – GJK 2015-04-01 16:09:33

我現在常常遇到這樣的問題，因爲我在我的博客文章中渲染了很好的HTML /行爲，偉大的組件，但我不能在我的帖子中替換多個[mycomponent] :(見這裏http://stackoverflow.com/questions/29265024/insert-partial-component-at-dynamic-location – Hedge 2015-04-01 16:14:44

訂閱Ember應用程序中的DOM事件

回答

相關問題