Farbwähler Wert nicht verbindlich mit Aurelia

Question

Ich versuche, Spektrum Farbauswahl in Aurelia zu verwenden. Ich habe das Spektrum Farbauswahl in meinem Projekt-Datei wie folgt

editBoard.js initialisiert

import "spectrum-colorpicker"; 
@autoinject() 
export class Read { 
    board = { 
      color:"#FFFFFF" 
     }; 

    attached() { 
     $("#colorpicker").spectrum(); 
    } 
} 

editBoard.html

<template> 
    <require from="spectrum-colorpicker/spectrum.css"></require> 
    <input type='text' id="colorpicker" value.two-way="board.color" /> 
    <div css="color : ${board.color};" style="width:100%; 
    height:100px;"></div> 
</template> 

, wenn ich es laden, es kommt in Ordnung. Der Farbwähler arbeitet gut und er hat die Farbe übernommen, die ich über die value.two-way="board.color" eingegeben habe, aber das Problem ist, dass wenn ich die Farbe vom Farbwähler ändere, nur der Eingabewert geändert wird, der board.color Wert wird nicht geändert. Gibt es irgendwelche Gründe, warum dies geschieht? Gibt es Lösungen für dieses Problem?

Answer 1

habe ich einen Kern für ein Wrapper benutzerdefinierte Element für Spektrum:

<spectrum color.bind="board.color"></spectrum> 

, was Sie fehlt in Ihrem Code zu dem Änderungsereignis hört von: https://gist.github.com/arabsight/cf9c588b60824eddd30f97accc634c17

Sie es wie folgt verwenden können den Picker und Aktualisieren des Wertes.