Question

我有一个基于Ember CLI的博客。我目前在应用程序控制器内部使用此功能单击它们时调整所有<img>内部帖子。

我依赖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')
});

Answer 1

如果您在Ember模板中插入所有图像，则可以随时使用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')
});

在我看来，以上是处理这种情况的“最Ember”方式。

订阅Ember app中的DOM活动

1 个答案: