javascript - 将 Annyang.js 语音识别与 Angularjs 集成

标签 javascript angularjs data-binding speech-recognition

我正在尝试集成 Annyang.jsAngular.js

我正在尝试将 Annyang.js 的结果与 DOM 绑定(bind)(Angular 风格)。一些想法可能是使用像 $watch、$apply、$digest 这样的 Angular 服务,或者创建指令/工厂/提供者???我不知所措。如有帮助,我们将不胜感激。

到目前为止,它可以理解 VoiceCtrl 范围内的命令,但不会绑定(bind)到 $scope.said

Javascript:

var SpeechApp = angular.module('SpeechApp', []);

function VoiceCtrl($scope) {

  $scope.said='';

  $scope.helloWorld = function() {
    $scope.said = "Hello world!";
  }

  $scope.commands = {
    'hello (world)': $scope.helloWorld,
  };

  annyang.debug();
  annyang.init($scope.commands);
  annyang.start();
}

HTML:

<body ng-app="Voice" ng-controller="VoiceCtrl">
    <p>{{said}}</p>
</body>

最佳答案

您似乎缺少 scope.$apply()。这是允许 Angular 更新所有绑定(bind)所必需的,因为 annyang.js 将在 Angular 上下文之外工作。

尝试将您的命令替换为

'Hello (world)': function() {
    $scope.$apply($scope.helloWorld);
});

关于javascript - 将 Annyang.js 语音识别与 Angularjs 集成,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19330671/

相关文章:

angularjs - 将 Angular 1 与 TypeScript 和 SystemJS 结合使用的简单示例

javascript - 构建选择的 Angular Directive(指令)未定义

javascript - 使用此正则表达式,为什么它只捕获最后一个列表项

javascript - 如何在knockoutjs中获取ko.compulated或ko.observable底层函数?

javascript - 异常 : Error: Uncaught (in promise): Error: Cannot match any routes: '' "

WPF:如何将 ItemsControl 中的项目包装在另一个模板中?

xaml - Xamarin Forms ListView 数据绑定(bind)

android - RecyclerView textChangeListener 或数据绑定(bind)

Javascript 继承 - Ctor 参数和重写函数

javascript - jQuery Isotope `arrangeComplete` 监听器不触发