Ember：<select>要素から渡されたアクションで属性の値を設定

Question

{{action}}ヘルパーを使用して、選択要素の選択肢に基づいて新しいEmber Data Recordの属性値を設定する方法を考えています。私の状況は以下の通りです。

item.js route。テンプレートで使用可能な新しいレコードを作成します。

model() { 
    return this.store.createRecord('item'); 
} 

新item.hbsテンプレート。 select-elementは、新しい項目のcolor属性を設定するアクションをトリガします。

<select {{action 'setColor' model value="target.value" on="change"}}> 
    <option value="">choose</option> 
    <option value="white">white</option> 
    <option value="blue">blue</option> 
    <option value="red">red</option> 
    <option value="yellow">yellow</option> 
</select> 

item.jsコントローラ。

actions: { 
    setColor(item, option) { 
    console.log(option); 
    record.set('color', option); 
    console.log(item); 
    } 
} 

Console.log（オプション）は何も返しません。 record.setは正常に動作し、オプションをハードコードすることができ、console.log（item）は、新しいitemオブジェクトにcolor属性が設定されていることを示します。一方

、私はちょうど

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

色でアクションの呼び出しを行う場合は、アクションから正しく記録されます。しかし、以前のように{{action ... on = "change"}}の構文で "model"を追加すると、console.log（option）はundefinedを返し、console.log（item）はno添付されたモデルオブジェクト。

質問です：はどのように私は両方 target.value と setColorをアクションにモデルを渡すのですか？

Answer 1

setColorファンクションはデフォルトで最後の引数としてevent属性を受け取ります。

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

のでvalue属性がeventから取得されます。これは期待どおりに動作します。しかし

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

value属性は、我々は最初の引数としてmodelを送ったとしてmodelプロパティからtarget.valueを取得しようとすると、デフォルトevent引数が2番目の引数として渡されます。そのため、結合は機能しません。

ソリューションは

onChange={{action 'setColor' model}} 

と内部のアクション、

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