Я использую angular-webspeech-директиву
Вот код HTML:
<!DOCTYPE html>
<html ng-app="plunker">
<head>
<meta charset="utf-8" />
<title>TestBed</title>
<link data-require="[email protected]" data-semver="3.0.0" rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" />
<link data-require="[email protected]" data-semver="4.3.0" rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" />
<link href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet" />
<link rel="stylesheet" href="css/style.css" />
</head>
<body ng-controller="MainCtrl" ng-cloak="">
<div class="container">
<div class="row">
<div class="col-md-12">
asdfasdf
<js-speech ng-model="speech"></js-speech>
<!--
<pre>js-speech ng-model="speech"</pre>
<br />-->
<strong>Debugger</strong>
<pre>$scope.speech:{{speech|json}}</pre>
</div>
</div>
</div>
<!-- Application Scripts -->
<script data-require="[email protected]" data-semver="2.0.3" src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
<script data-require="[email protected]" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js" data-semver="1.0.8"></script>
<script data-require="[email protected]" data-semver="2.6.2" src="//cdnjs.cloudflare.com/ajax/libs/modernizr/2.6.2/modernizr.js"></script>
<script src="js/Speech.js"></script>
<script src="js/speechapp.js"></script>
</body>
</html>
Здесь угловая речьapp.js
(function() {
var app;
app = angular.module("plunker", ["jonniespratley.angularWebSpeechDirective"]);
app.controller("MainCtrl", function($scope) {
return $scope.speech = {
maxResults: 25,
continuous: true,
interimResults: true
};
$scope.$on('onresult', function() {console.log( "---->speech.interimResults<----" );});
$scope.test=function(){
console.log( "---->speech.interimResults<----" );
}
$scope.$digest();
$scope.$watch('$scope.speech.interimResults', function() {console.log( "---->speech.interimResults<----" ); }, true);
$scope.$watch('speech.interimResults', function(newVal, oldVal) {
//do something here like get the text input value and send to api
//after speaking even the value of speech.intermResults change this does not get triggered.
return console.log(newVal);
}, true);
});
}).call(this);
то, что я хотел произойти, - это когда пользователь завершает разговор в Mic, я могу получить вход txt, чтобы опубликовать текстовый контент. Мне нужно получить содержимое ввода текста и отправить его в API, однако я не могу найти привязку к событию onresult директивы.
Это хороший способ посмотреть scope.speech, я попробовал $ scope. $ Watch, чтобы увидеть, изменился ли параметр $ scope.speech, но он не работает. Заранее благодарю за любую помощь.
Не используйте $scope
для привязки переменных области в $watch
. Поэтому вместо
$scope.$watch('$scope.speech.interimResults', function () {
console.log("---->speech.interimResults<----");
}, true);
вы должны написать
$scope.$watch('speech.interimResults', function () {
console.log($scope.speech.interimResults);
}, true);