我有一个Ember应用程序,并且正在使用一个 Action 来应用CSS动画。动画制作完成后,我想将 Action 从 Controller 扩展到我的路线,以处理其他功能。

我知道,如果我return: true;,操作将冒泡,如here所述。

这是我的 Controller 的外观:

App.MyController = Ember.ObjectController.extend({
    actions: {
        myAction: function() {
            $('.my-element').addClass('my-animation-class').one('webkitAnimationEnd oanimationend msAnimationEnd animationend', function(e) {
                console.log('working');
                return true;
            }
        }
    }
});

如果我在animationend回调中将某些内容记录到控制台,则可以看到它正常工作,并且如果将return: true;移到回调之外,则操作成功完成。但是,在回调内部返回true无效。

我想念什么?

最佳答案

您可以通过调用self.target.send('myAction');手动触发气泡

像这样定义的IndexController

App.IndexController = Ember.Controller.extend({
  actions: {
    bubbleMe: function(item){
      var self = this;
      alert('IndexController says you clicked on: ' + item);
      setTimeout(function(){
        self.target.send('bubbleMe',[item]);
      }, 1000);
    }
  }
});

会冒泡到这样定义的ApplicationRoute
App.ApplicationRoute = Ember.Route.extend({
  actions: {
    bubbleMe: function(item){
      alert('ApplicationRoute says you clicked on: ' + item);
    }
  }
});

您可以在这里看到有效的 fiddle :http://jsfiddle.net/tikotzky/2ce9s32f/

09-10 00:00
查看更多