EmberJS动作 - 当包含在“动作”中时，调用另一个动作 [英] EmberJS actions - call one action from another when wrapped within `actions`

问题描述

如果您在EmberJS控制器中的操作中包装时，如何调用另一个操作的一个操作？代码使用现在不推荐的方式来定义操作：

  // app.js 
 App.IndexController = Ember。 ArrayController.extend（{
 // property 
 / * ... * / 
 
 // actions 
 actionFoo：function（）{
 / * ... * / 
 this.actionBar（）; 
}，
 actionBar：function（）{
 / * ... * / 
} 
}）; 
 
 //app.html 
< div class =foo{{action actionFoo this}}> 
< div class =bar{{action actionBar this}}> 
  

但是，使用EmberJS 1.0.0，我们会收到一个弃用警告，表示必须将操作放在控制器内的操作对象，而不是直接在控制器内，如上所述。

根据建议更新代码：

  // app.js 
 App.IndexController = Ember.ArrayController.extend（{
 // properties 
 / * ... * / 
 
 // actions 
 actions：{
 actionFoo：function（）{
 / * ... * / 
 this.actionBar（） ; //this.actionBar未定义
 // this.actions.actionBar（）; //this.actions未定义
}，
 actionBar：function（）{
 / * ... * / 
} 
} 
}）; 
 
 //app.html 
< div class =foo{{action actionFoo this}}> 
< div class =bar{{action actionBar this}}> 
  

但是，我发现在动作中定义的一个函数不可能调用另一个函数，因为这个对象似乎不再是控制器。

我该怎么做？

解决方案

您可以使用 send（actionName，arguments）

  App.IndexController = Ember.ArrayController.extend（{
 actions：{
 actionFoo：function（）{
 alert（'foo'）; 
 this.send（'actionBar'）; 
}，
 actionBar：function（）{
 alert（'bar'）; 
} 
} 
}）; 
  

这是一个jsfiddle这个例子http://jsfiddle.net/marciojunior/pxz4y/

How do you call one action from another action when wrapped within actions in an EmberJS controller?

Original code that uses the now deprecated way to define actions:

//app.js
App.IndexController = Ember.ArrayController.extend({
    // properties
    /* ... */

    // actions
    actionFoo: function() {
        /* ... */
        this.actionBar();
    },
    actionBar: function() {
        /* ... */
    }
});

//app.html
<div class="foo" {{action actionFoo this}}>
<div class="bar" {{action actionBar this}}>

However, with EmberJS 1.0.0, we get a deprecation warning, saying that actions must be put within an actions object within the controller, instead of directly within the controller, as above.

Updating the code, according to recommendations:

//app.js
App.IndexController = Ember.ArrayController.extend({
    // properties
    /* ... */

    // actions
    actions: {
        actionFoo: function() {
            /* ... */
            this.actionBar(); //this.actionBar is undefined
            // this.actions.actionBar(); //this.actions is undefined
        },
        actionBar: function() {
            /* ... */
        }
    }
});

//app.html
<div class="foo" {{action actionFoo this}}>
<div class="bar" {{action actionBar this}}>

However, I find that it is not possible for one function defined within actions to call another, as the this object appears to no longer be the controller.

How can I go about doing this?

解决方案

You can use the send(actionName, arguments) method.

App.IndexController = Ember.ArrayController.extend({
    actions: {
        actionFoo: function() {
            alert('foo');
            this.send('actionBar');
        },
        actionBar: function() {
            alert('bar');
        }
    }
});

Here is a jsfiddle with this sample http://jsfiddle.net/marciojunior/pxz4y/

这篇关于EmberJS动作 - 当包含在“动作”中时，调用另一个动作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！