Angular、ngModel和Dragon Voice

Question

我正在开发一个角度驱动的应用程序，正在添加龙的语音识别功能，当使用龙的“拼写”命令在文本框中输入文本时，文本控件的ngModel不会更新。

在使用语音识别时，如何让控件的ngModel更新模型，以便我们的应用程序对语音和非语音用户都能按预期运行？

注意:应用程序当前使用的是angular v1.2.x

Answer 1

在深入研究ng- $viewValue之后，我发现基于文本的ngModel不会在拼写过程中更新ngModleControllers $viewValue(这是由Dragon在“Composition Event”模式下触发的)。我后来找到了ngModelOptions并尝试使用它，但这会提交对$viewValue的更改，而不是实际的更改。

在我们的场景中，用户通常会按下'enter‘键来提交文本框的内容，因此我们创建了以下指令来解决这种情况

directive('sqEnter', ['$timeout',function ($timeout) {
    return {
        restrict: 'A',
        link: function (scope, element, attrs) {
            var composing = false;
            element.on('compositionstart', function (data) {
                composing = true;
            });

            element.on('compositionend', function () {
                composing = false;
            });

            element.on('keydown keypress', function (event) {
                if (event.which === 13) {
                    event.preventDefault();
                if (composing) {
                    element.trigger('compositionend');
                    $timeout(handler, 5);
                }
                else handler();                    
            }
        });
        function handler() {
                scope.$apply(function () {
                    scope.$eval(attrs.sqEnter);
                });
            }                            
        }
    }
}]);

用法：<input type='text' ng-model='myValue' sq-enter='doSomething()' />。

这里重要的事情是在适当的时候触发compositionend事件，以便模型正确更新。