将安阳.js语音识别与棱角.js相结合

Integrating Annyang.js speech recogniton with Angular.js

本文关键字:js 相结合 语音识别 安阳      更新时间:2023-09-26

我正在尝试整合安阳.js和Angular.js。

我正在尝试使安阳的结果.js与DOM绑定(角度样式(。一些想法可能是使用角度服务,如$watch、$apply、$digest,或者创建一个指令/工厂/提供者???我不知所措。帮助将不胜感激。

到目前为止,它理解VoiceCtrl范围内的命令,但它不绑定到$scope。

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 更新所有绑定所必需的.js因为 annyyang 将在 angular 上下文之外工作。

尝试将命令替换为

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

此外,你在JS中调用模块"SpeechApp",在HTML中调用ng-app="Voice"。

建议改用此 HTML:

  <body ng-app="SpeechApp">
    <div ng-controller="VoiceCtrl">
      <p>Hi: {{said}}</p>
    </div>
  </body>

http://plnkr.co/edit/QIWwhS?p=preview

看看 AngularJS 语音识别与安阳