在 Ember 2.2 中将一个动作从子组件发送到父组件
Sending an action from a sub component to parent component in Ember 2.2
您好,我正在尝试将子组件的操作发送回父组件,以便它可以访问 this.store 并执行数据库操作。基本布局是这样的:
app/templates/item/index.hbs -> 使用组件
循环项目
{{#each model as |item|}}
{{item-listing item=item}}
{{/each}}
app/templates/components/item-listing.hbs
<li><a {{action 'copyItem' item}}>Copy</a></li>
在 app/components/item-listing.js 中,我必须定义一个动作,否则我会得到一个动作未定义的错误。从这里 this.store 是未定义的,所以我试图冒泡这个动作。
actions: {
copyItem: function(item) {
this.sendAction('copyItem', item);
},
从这里我迷路了。我已尝试对以下所有内容执行操作:
/app/routes/item/index.js
/app/routes/item.js
但它似乎永远不会通过 sendAction 调用。我做错了什么?
你必须:
- 在您的控制器 (ItemIndexController) 中定义该操作 (
copyItem
)。
- 在模板循环中传递该操作:
第一种方式:
{{#each model as |item|}}
{{item-listing item=item copyItem='copyItem'}}
{{/each}}
第二种方式:
{{#each model as |item|}}
{{item-listing item=item copyItem=(action 'copyItem')}}
{{/each}}
您好,我正在尝试将子组件的操作发送回父组件,以便它可以访问 this.store 并执行数据库操作。基本布局是这样的:
app/templates/item/index.hbs -> 使用组件
循环项目 {{#each model as |item|}}
{{item-listing item=item}}
{{/each}}
app/templates/components/item-listing.hbs
<li><a {{action 'copyItem' item}}>Copy</a></li>
在 app/components/item-listing.js 中,我必须定义一个动作,否则我会得到一个动作未定义的错误。从这里 this.store 是未定义的,所以我试图冒泡这个动作。
actions: {
copyItem: function(item) {
this.sendAction('copyItem', item);
},
从这里我迷路了。我已尝试对以下所有内容执行操作:
/app/routes/item/index.js /app/routes/item.js
但它似乎永远不会通过 sendAction 调用。我做错了什么?
你必须:
- 在您的控制器 (ItemIndexController) 中定义该操作 (
copyItem
)。 - 在模板循环中传递该操作:
第一种方式:
{{#each model as |item|}}
{{item-listing item=item copyItem='copyItem'}}
{{/each}}
第二种方式:
{{#each model as |item|}}
{{item-listing item=item copyItem=(action 'copyItem')}}
{{/each}}