2016-07-12 6 views
2

Я портирую приложение Angular для Aurelia в качестве учебного упражнения, и я не был уверен, как воссоздать поведение Angular ng-change.Aurelia версия Anggle's ng-change

Существует элемент, который при изменении срабатывает при обратном вызове javascript. Я не уверен, как это сделать в Аурелии. Или я должен просто использовать HTML5?

ответ

7

Для того, чтобы связать метод/выражение к событию, использовать event.delegate="expression", заменив «событие» с действительным именем события, как change или input.

Вот пример: 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> 

app.js

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

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

Примечание: если событие не пузырь (например, фокус/размытие), используйте event.trigger и установите привязку непосредственно на который запустит событие. Например, <input blur.trigger="doSomething()">.

+0

Это то, что я получаю за ответ со своего мобильного телефона –

+0

Я пью ваш молочный коктейль –

1

change.delegate="someViewModelMethod()"