javascript 如何在来自 Handlebars 模板的输入字段中使用 Ember.js 的操作 Helper 传递参数？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/18762783/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to pass parameters with the action Helper of Ember.js inside an input field from an Handlebars template?
提问by Massimo Guidi
In my handlebars template I have this loop:
在我的把手模板中，我有这个循环：
{{#each itemController="fund"}}
<li>
<label>{{title}}</label>
<span>{{amount}}</span>
{{input type="text" placeholder="new user"
value=newFullName action="createUser"}}
{{partial 'user-list'}}
</li>
{{/each}}
and need to pass the current object as parameter to the 'createUser' action. Something like this:
并且需要将当前对象作为参数传递给“createUser”操作。像这样的东西：
action="createUser(this)"
or:
或者：
action 'createUser' this
But it seems that ember can't handle parameters for actions inside an input field...
但似乎 ember 无法处理输入字段内操作的参数......
Am i missing something?
我错过了什么吗？
采纳答案by Marcio Junior
I think that isn't possible to do this using the actionproperty from inputview helper.
我认为使用视图助手的action属性是不可能的input。
A workaround could be wrap your input in a form that use the actionview helper using the submit event, like the following:
一种解决方法是将您的输入包装在action使用提交事件的视图助手的表单中，如下所示：
Template
模板
{{#each}}
<li>
<form {{action "createUser" this on="submit"}}>
{{name}}
{{input type="text" value=name}}
</form>
</li>
{{/each}}
Route
路线
...
actions: {
createUser: function(user) {
alert(user.get('name'));
}
}
...
So when the user hit enter, will have the event triggered.
所以当用户按下回车键时，将触发事件。
The main difference between the action property and the action view helper is that the action view helper is more flexible and you can supply the context and put it inside of any tag:
动作属性和动作视图助手之间的主要区别在于动作视图助手更灵活，您可以提供上下文并将其放在任何标签内：
<div {{action "someAction" someObject}} on="click">Click me</div>
In the route:
路线中：
actions: {
someAction: function(someObject) {
// do something with the someObject
}
}
See the docsfor further information
有关更多信息，请参阅文档
Please give a look in the jsfiddle to see that sample in action http://jsfiddle.net/marciojunior/UAgjX/
请查看 jsfiddle 以查看该示例的操作http://jsfiddle.net/marciojunior/UAgjX/
I hope it helps
我希望它有帮助
回答by andorov
You can now pass a function, along with values -
您现在可以传递一个函数以及值 -
submit=(action 'setName' 'Sal')
http://emberjs.com/blog/2015/06/12/ember-1-13-0-released.html#toc_closure-actions
http://emberjs.com/blog/2015/06/12/ember-1-13-0-released.html#toc_closure-actions
回答by Massimo Guidi
Finally i ended up with this solution:
最后我得到了这个解决方案：
Template
模板
{{input class="newUser" type="text" value=newFullName placeholder="add user"}}
<button {{action 'createUser' this newFullName}}>Send</button>
Controller
控制器
createUser: function (fund, newFullName) {
var fullName = newFullName;
var user = this.store.createRecord('appUser', {
fullName: fullName,
fund: fund,
payments:[]
});
user.save().then(function(){
fund.get('users').pushObject(user);
fund.save().then(function(){
fund.reload();
});
});
}
回答by Khanad
You can pass a parameter to an action helper :{{action "doSomething" xxx }}
您可以将参数传递给操作助手：{{action "doSomething" xxx }}
Where doSomething is your controller method ,and xxx is anything in the current context of the template.
其中 doSomething 是您的控制器方法，而 xxx 是模板当前上下文中的任何内容。
