Question

我试图找出如何使用{{action}}帮助器根据select元素中的选项设置新的Ember数据记录的属性值。这是我的情况，简化： item.js路线。创建模板中可用的新记录。 model（）{ 返回this.store.createRecord（＆＃39; item＆＃39;）; } new-item.hbs模板。 select元素触发动作以设置新项目的颜色属性。＆lt; select {{action＆＃39; setColor＆＃39;模型值=＆＃34; target.value＆＃34;上=＆＃34;变更＆＃34;}}＆GT; ＆lt; option value =＆＃34;＆＃34;＆gt;选择＆lt; / option＆gt; ＆lt; option value =＆＃34; white＆＃34;＆gt; white＆lt; / option＆gt; ＆lt; option value =＆＃34; blue＆＃34;＆gt; blue＆lt; / option＆gt; ＆lt; option value =＆＃34; red＆＃34;＆gt; red＆lt; / option＆gt; ＆lt;选项值=＆＃34;黄色＆＃34;＆gt;黄色＆lt; /选项＆gt; ＆LT; /选择＆GT; item.js控制器。行动：{ setColor（item，option）{ 的console.log（可选）; record.set（＆＃39; color＆＃39;，option）; 的console.log（项目）; } } Console.log（选项）什么都不返回。 record.set工作正常，我可以硬编码选项，console.log（item）将显示新项目对象具有颜色属性集。另一方面，如果我只使用动作调用 onChange = {{action＆＃39; setColor＆＃39;值=＆＃34; target.value＆＃34;}} 从操作中正确记录颜色。但是，如果我添加＆＃34;模型＆＃34;使用{{action ... on =＆＃34;更改＆＃34;}}语法进入该操作调用，console.log（选项）返回undefined，console.log（item）返回没有模型对象的Event连接。问题是：如何将target.value和模型同时传递给setColor操作？

Answer 1

默认情况下，

setColor函数将接收event属性作为最后一个参数。

onChange={{action 'setColor' value="target.value"}}

这样value属性将从event中检索出来。所以这将按预期工作。但是

onChange={{action 'setColor' model value="target.value"}}

当我们发送value作为第一个参数时，

target.value属性将尝试从model属性获取model，并且默认event参数将作为第二个参数传递论点。因此结合不了工作。

解决方案是

onChange={{action 'setColor' model}}

和内部行动，

actions: {
  setColor(model, event) {
    let value = event.target.value;
  }
}

Answer 2

我只是遇到了同样的问题，但是对这里接受的答案不满意，因为我有2个不同的输入（下拉列表和文本字段）使用了相同的操作（但没有相同的路径来解析值），所以我必须使用value="..."作为动作助手的一部分。

我在https://stackoverflow.com/a/45762071/45948

中找到了答案

所以您的情况是：

onChange={{action (action 'setColor' model) value="target.value"}}

然后简单地：

actions: {
  setColor(model, option) {
    ...
  }
}

Ember：使用从<select>元素传递的操作设置属性的值

2 个答案: