Ember中无法向action传递参数的问题求助

嘿，我一看你的代码就发现问题出在哪了——你用错了Ember Action传递参数的方式！不是不能传参，只是写法不对导致参数一直是undefined。

问题根源 #

你模板里写的{{action "selectGIF" value=gif}}是错误的：Ember的Action助手传递参数不需要用key=value的形式，value=gif这种写法其实是在给action助手配置选项，不是传递参数，所以控制器里的num自然拿不到值。

一步一步修正 #

1. 改模板里的Action调用 #

把参数直接放在action名称后面就行，就像这样：

<div class="gif-display">
  {{#each giffy as |gif index|}}
    <img width="150px" {{action "selectGIF" gif}} src={{gif.images.original.url}}>
  {{/each}}
</div>

如果之后需要传递索引index，直接追加参数就行：{{action "selectGIF" gif index}}

2. 调整控制器的逻辑 #

现在传递的是完整的gif对象，你就不用再通过gifs[num]去取值了，直接用参数里的对象就行。另外注意你代码里的gifs变量没定义，建议改成控制器属性的写法：

selectGIF: function (selectedGif) {
  console.log("选中的GIF:", selectedGif);
  let newPost = this.store.createRecord('post', {
    email: this.get("session.currentUser.email"),
    body: `${selectedGif.images.original.url}`,
    timestamp: new Date().getTime(),
    image: true
  });
  // 如果gifs是控制器的属性，用this.set来修改
  this.set("gifs", '');
  newPost.save();
}

额外提醒 #

你说其他地方{{action "函数名"}}写法正常，是因为那些场景不需要传参，所以没问题；一旦要传参，必须把参数直接放在action名称后面，不能用键值对的形式。完全不需要额外用helper函数，用标准的action传参方式就搞定了。

内容的提问来源于stack exchange，提问作者anon