我如何在回调函数中冒出Ember动作？ [英] How can I bubble up an Ember action inside a callback function?

问题描述

我有一个Ember应用程序，我使用一个动作来应用CSS动画。一旦动画完成，我想把控制器的动作冒泡到我的路由以处理更多的功能。

我知道如果我 return ：true; ，则操作将弹出，如此处所述。

这是我的控制器的样子：

  App.MyController = Ember.ObjectController.extend（{
 actions：{
 myAction：function（）{
 $（'。my-element'）。addClass（'my-animation-class'）。一个（'webkitAnimationEnd oanimationend msAnimationEnd animationend'，function（e）{
 console.log（'working'）; 
 return true; 
} 
} 
}如果我在我的中记录到我的控制台， animationend  callback我可以看到它工作，如果我移动 return：true; 在回调之外，动作起来成功。 
解决方案。
 
 
 
 
您可以通过调用 self.target.send（'myAction'）;  
手动触发冒泡
 
 
  IndexController 定义如下
  App.IndexController = Ember.Controller.extend（{
 actions：{
 bubbleMe：function（item）{
 var self = this; 
 alert（'IndexController that you clicked：'+ item ）; 
 setTimeout（function（）{
 self.target.send（'bubbleMe'，[item]）; 
}，1000）; 
} 
} 
}）; 
  
会冒泡为 ApplicationRoute  
  App.ApplicationRoute = Ember.Route.extend（{
 actions：{
 bubbleMe：function项目）{
 alert（'ApplicationRoute说你点击：'+ item）; 
} 
} 
}）; 
  
您可以在这里看到一个工作的小提琴： http://jsfiddle.net/tikotzky/2ce9s32f/  
 
I have an Ember application and I am using an action to apply a CSS animation. Once the animation is complete I want to bubble up the action from the controller to my route to handle further functionality.

I know that if I return: true; the action will bubble up, as explained here.

This is what my controller looks like:
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;
            }
        }
    }
});
If I log something to my console in my animationend callback I can see it working and if I move return: true; outside of the callback, the action bubbles up successfully. However, returning true inside of the callback does not work.

What am I missing?
解决方案
you can manually trigger the bubble by calling self.target.send('myAction');

an IndexController defined like this
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);
    }
  }
});
would bubble to an ApplicationRoute defined like this
App.ApplicationRoute = Ember.Route.extend({
  actions: {
    bubbleMe: function(item){
      alert('ApplicationRoute says you clicked on: ' + item);
    }
  }
});
You can see a working fiddle here: http://jsfiddle.net/tikotzky/2ce9s32f/

                        
这篇关于我如何在回调函数中冒出Ember动作？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！