ng-change / ng-keyup / $scope.$watch while building Korean characters not working

[migu0]

I'm building a Korean vocabulary trainer and I want to compare user input as people type.

In Korean and some other Asian languages, you build letters with multiple keyup events. In Chrome and after Angular version 1.2.1 (works fine in 1.2.1), $scope.$watch, ng-change and ng-keyup can only access typed characters once they have been fully composed and the composition of a next letter has started (or a space bar has been entered).

Here's some example code with the following, undesired result:

Input: ㄱ 
Console:
ng-keyup : undefined

Input: 가
Console:
ng-keyup : undefined

Input: 감 (character is now fully composed)
Console:
ng-keyup : undefined

Input: 감ㅅ (starting the next character, same behaviour with space bar)
Console:
ng-change : 감
ng-watch: 감 undefined
ng-keyup : 감

If you change the Angular version of the Fiddle under External Resources to https://ajax.googleapis.com/ajax/libs/angularjs/1.2.1/angular.min.js, the console will log each typed character and not only once the character has been fully composed and the next character has started.

[pkozlowski-opensource]

@michaelimstepf the behavior you see was introduced in 1.2.2 (via a4e6d96) as a deliberate choice.

[pkozlowski-opensource]

@michaelimstepf are you sure that ng-keyup was working correctly before 1.2.2? Looking at the code for the ngKeyup directive I can't see anything that would prevent ng-keyup from behaving differently...

[pkozlowski-opensource]

OK, so it looks like browsers are free to suppress key up/down events:

During the composition session, all keydown and keyup events may be suppressed.

https://dvcs.w3.org/hg/dom3events/raw-file/tip/html/DOM3-Events.html#events-composition-event-key-events

Seems like there is a quite lengthy discussion about it on the browsers side, ex.: https://bugzilla.mozilla.org/show_bug.cgi?id=354358

Not sure we can do much about key up/down events and we don't want to revert a4e6d96 so I'm afraid that you will have to write a custom directive and listen to events that give you intermediate chars during a composition event.

[migu0]

@pkozlowski-opensource Thanks a lot Pawel. I created at custom directive as suggested: http://stackoverflow.com/questions/27663149/angularjs-trigger-ng-change-ng-keyup-or-scope-watch-while-composing-korean-c/27735677#27735677. Please let me know if there's a better to do it. Thanks...