Wie man eine Checkbox-Bindung in Aurelia einrichtet

Question

Ich habe eine Checkbox-Liste, wenn der Benutzer eines der Kontrollkästchen eine Funktion in der JS-Datei aufgerufen wird und es ruft wiederum eine Methode dataservice.js, die einen Webapi-Controller aufruft , das alles funktioniert gut und gibt die richtigen Daten zurück.

Was passiert, wenn der Prozess abgeschlossen ist, ist, dass das Kontrollkästchen, das die Sequenz ausgelöst hat, nicht überprüft wird. Ich habe das Ergebnis überprüft, und schoolDistrict.IsChecked für dieses Element ist auf "true" gesetzt, was korrekt ist.

Wie bekomme ich das Kontrollkästchen überprüft werden?

Unten ist der Code, aber ich bin nicht sicher über die check.one-Wege binden

<li repeat.for="schoolDistrict of schools.Districts">          
    <input type="checkbox" checked.one-way="schoolDistrict.IsChecked" value="${schoolDistrict.Value}" click.trigger="searchSchoolDistrict()"/>${schoolDistrict.Name} 
</li> 

Jede Hilfe sehr geschätzt würde.

Answer 1

Es gibt ein paar Probleme hier:

• Das Problem ist wahrscheinlich, dass Ihr searchSchoolDistrict() Code die IsChecked Eigenschaft verändert, aber die one-way Bindung ist nicht für den Wechsel zu hören.
• Während Interpolation der Wert funktionieren würde, ist die Verwendung der Bindesyntax wahrscheinlich besser Stil.
• Das Einrichten einer change.delegate ist robuster und wird alle Änderungen in der Checkbox abhören, was eine bewährte Methode für Checkboxen ist.
• Veraltete für searchSchoolDistrict() Achten Sie darauf, den richtigen Umfang wählen, da es wahrscheinlich die $parent und nicht schoolDistrict lebt.

Versuchen Sie es mit dieser statt:

<li repeat.for="schoolDistrict of schools.Districts">          
    <input type="checkbox" 
    checked.bind="schoolDistrict.IsChecked" 
    value.one-way="schoolDistrict.Value" 
    change.delegate="searchSchoolDistrict()"/> 
    ${schoolDistrict.Name} 
</li>