Angular, ngModel und Dragon Voice

Question

Ich arbeite an einer Angular powered-Anwendung, die Dragon-Spracherkennung hinzufügt, und wenn Sie Dragon 'Spell' Befehl verwenden, um Text in einem Textfeld einzugeben, wird das ngModel für das Textsteuerelement nicht aktualisiert.

Wie kann ich ngModel für das Steuerelement erhalten, um das Modell zu aktualisieren, wenn die Spracherkennung verwendet wird, so dass sich unsere Anwendung sowohl für Benutzer von Sprach- als auch von Nicht-Sprachfunktionen wie erwartet verhält?

Hinweis: Die Anwendung verwendet derzeit Winkel V1.2.x

Answer 1

Nach einigem Graben in ng-Modell ein bisschen mehr, fand ich, dass ngModel für textbasierte < Eingänge > aktualisiert nicht die ngModleControllers$viewValue, wenn ein Composition Event wird gerade ausgeführt (dies wird von Dragon ausgelöst, wenn es sich im 'Zauber'-Modus befindet). Ich fand später ngModelOptions und versuchte, es zu verwenden, aber das Commits Änderungen an $viewValue und nicht Änderungen von der tatsächlichen <Eingabe>.

Für unser Szenario würde der Benutzer normalerweise drücken Sie die ‚Enter‘ Taste um den Inhalt des Textfeldes zu unterbreiten, so haben wir die folgende Direktive unserer Situation

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); 
       }); 
      }        
     } 
    } 
}]); 

Verbrauch zu beheben: <input type='text' ng-model='myValue' sq-enter='doSomething()' />.

Die wichtige Sache hier war, das compositionend Ereignis auszulösen, wenn passend, also aktualisiert das Modell richtig.