我有一个用于CRUD中每一行的item-row.js组件和一个触发“addNewItem”的按钮,因为我需要做一些额外的处理。
嗯,动作永远不会冒泡到路线,所以我相信我做错了什么。恩伯指南会告诉我完全正在做的事情,所以我完全迷失在这里。我错过了什么吗?
代码:
我的模板是这样的:
// my-template.hbs
{{#each model as |item|}}
{{#item-row
id = item.id
text = item.text
}}
{{item.title}}
{{/item-row}}
{{/each}}
在该组件的模板中:
// item-row.hbs
// a couple of HTML here
<button {{action "addNewItem"}}> </button>
我有一个组件,当然
// item-row.js
export default Ember.Component.extend({
actions: {
addNewItem: function(){
this.sendAction('addNewItem');
// already tried this.sendAction() without the parameter..
return true;
}
}
});
最后,我的路线:
// item.js
export default Ember.Route.extend({
actions: {
addNewItem: function(){
alert('reached the route!!!!!');
// this is never printed =/
}
}
});
我感谢任何帮助:)
答案 0 :(得分:5)
组件中的sendAction
方法将在组件上查找与传递该方法同名的属性,在本例中为'addNewItem'
。因此,为了让您的示例正常工作,您需要将addNewItem = 'addNewItem'
传递给item-row
组件,以便组件知道要在路径上触发的操作。
您可以查看this JSBin,了解我所谈论的内容。它使用全局变量而不是ES6模块,但希望它应该足够简单:)
Ember指南的{p> This section也可能对您有所帮助。