2017-03-05 2 views
1

Ich versuche herauszufinden, wie man den Attributwert eines neuen Ember Data Record basierend auf Auswahlen in einem select Element mit Hilfe des {{action}} Helfers setzt. Hier ist meine Situation, vereinfacht:Ember: setze Attributwert mit Aktion, die von einem <select> Element übergeben wurde

item.js Route. Erstellt einen neuen Datensatz, der in der Vorlage verfügbar ist.

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

neu item.hbs Vorlage. Das select-Element löst die Aktion zum Festlegen des Farbattributs des neuen Elements aus.

<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 Controller.

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

Console.log (Option) gibt nichts zurück. Das record.set funktioniert gut, ich kann die Option fest codieren und die console.log (Element) zeigt, dass das neue Objekt das Attribut color gesetzt hat.

Auf der anderen Seite, wenn ich nur mit

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

der Farbe den Aktionsaufruf tun wird korrekt von der Aktion angemeldet. Aber wenn ich "Modell" in diesen Aktionsaufruf wie zuvor mit der Syntax {{action ... on = "ändern"}} einfüge, gibt console.log (Option) undefined zurück und console.log (item) gibt ein Event mit nein zurück Modellobjekt beigefügt.

Frage ist: Wie gehe ich sowohl die Target.Value und das Modell auf die setColor Aktion?

Antwort

2

setColor Funktion wird event Attribut als letztes Argument standardmäßig erhalten.

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

so value Attribut wird von event abgerufen werden. also wird dies wie erwartet funktionieren. aber

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

value Attribut wird versuchen target.value von model Eigenschaft zu erhalten, wie wir model als erstes Argument gesendet, und dem Standard event Argument wird als zweites Argument übergeben werden. also wird das Kombinieren nicht funktionieren.

Lösung würde

onChange={{action 'setColor' model}} 

und innen Aktionen sein,

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

Eigentlich 'event' als zweites Argument übergeben –

+0

Ja. es ist immer als letztes Argument bestanden – kumkanillam

+0

Funktioniert perfekt. Vielen Dank, guter Herr. –

Verwandte Themen