Aurelia-Version von Angular's ng-change

Question

Ich portiere eine Angular-App nach Aurelia als Lernübung, und ich war mir nicht sicher, wie ich das angular ng-change-Verhalten neu erstellen sollte.

Es gibt ein Element, das bei Änderung einen Javascript-Callback auslöst. Ich weiß nicht, wie ich das in Aurelia machen soll. Oder sollte ich nur den HTML5 verwenden?

Answer 1

Um eine Methode/Expression zu einem Ereignisse zu binden, event.delegate="expression" verwenden, „Ereignis“ mit dem aktuellen Ereignisnamen wie change oder input ersetzen.

Hier ist ein Beispiel: https://gist.run?id=a3ced6a08842a421a715c7df068b41d5

app.html

<template> 
    <form change.delegate="changeCount = changeCount + 1" 
     input.delegate="incrementInputCount($event.target)"> 
    <p> 
     This form has changed ${changeCount} times. 
     The input event has fired ${inputCount} times. 
    </p> 
    <input type="text" placeholder="type something..."> 
    <input type="text" placeholder="type something..."> 
    <input type="text" placeholder="type something..."> 
    </form> 
</template> 

export class App { 
    changeCount = 0; 
    inputCount = 0; 

    incrementInputCount(inputElement) { 
    console.log(inputElement.value); 
    this.inputCount++; 
    } 
} 

Hinweis app.js: wenn das Ereignis nicht Blase tut (zB Fokus/blur), benutze event.trigger und lege die Bindung direkt auf die Element, das das Ereignis auslöst. Zum Beispiel <input blur.trigger="doSomething()">.

Answer 2

change.delegate="someViewModelMethod()"