Lightning コンポーネントで変更イベントをリッスンする

入力を修正する場合は <lightning:input> コンポーネントの onchange 属性を利用する必要があります。こうすることで、コントローラーコードで component.set() を使用して入力を編集できるようになります。 

変更をリッスンする 1 つの方法として、<aura:handler name="change"> の値を変更コンポーネントにするというものがあります。この方法では <aura:attribute> に対する変更がリッスンされますが、コントローラーコードで component.set() を使用して入力を編集する場合、この方法は使用できません。これは起こりうるエラーを防止するための措置です。たとえば、"foo" が数値項目に入力された場合、値を "" に戻しても実際には入力がこれにリセットされません。 

間違った例:

<aura:attribute name="myValue" type="String">
<aura:handler name="change" value="{!v.myValue}" action="{!c.handleChange}" />
<lightning:input type="text" name="textInput" label="Enter some text" value="{!v.myValue}" />

こちらの例では、コントローラーコードで handleChange, component.set("{!v.myValue}", "New text") を実行しても v.myValue に "New text" が設定されません。

正しい例:

<lightning:input type="text" name="textInput" label="Enter some text" value="{!v.myValue}" onchange="{!c.handleChange}" />

こちらの例では、コントローラーコードで component.set("{!v.myValue}", "New text") を実行すると myValue に "New text" が設定されます。

詳細については、Aura コンポーネントの入力のドキュメントを参照してください。