通过创建如下界面,我能够在TypeScript中运行SpeechRecognition,并且工作正常:
namespace CORE{ export interface IWindow extends Window{ webkitSpeechRecognition: any; } }
我尝试对SpeechSynthesis使用相同的方式,但是在字段中,以下代码不起作用:
namespace CORE{ export interface IWindow extends Window{ SpeechSynthesisUtterance: any; speechSynthesis: any; } }
我的问题是:
是我用来定义SpeechRecognition
TypeScript的最佳实践,还是有更好的方法。
如何SpeechSynthesis
在TypeScript中使用。
供参考,以下是我的工作代码SpeechRecognition
:
namespace CORE{ export interface IWindow extends Window{ webkitSpeechRecognition: any; } } namespace CORE{ export class speakRecognation{ // spoken:string; constructor(input:HTMLInputElement){ var audio = new Audio('/sounds/sound.mp3'); //Voice recognition const {webkitSpeechRecognition}: IWindow =window; const recognition = new webkitSpeechRecognition(); recognition.continuous = false; recognition.interimResults = true; input.addEventListener("click", function(){ audio.play(); recognition.start(); }); recognition.onstart = function () { recognition.recognizing = true; }; recognition.onresult = function (event) { var interim_transcript = ''; for (var i = event.resultIndex; i < event.results.length; ++i) { if (event.results[i].isFinal) { var result = event.results[i][0].transcript; input.value = result; // input.disable=false; Program.execute(result); recognition.stop(); } else { interim_transcript += event.results[i][0].transcript; input.value = interim_transcript; } } }; recognition.onerror = function (event) { input.value = "Something went wrong. Try reloading the page."; } recognition.onnomatch = function (event) { input.value = "no match"; } input.addEventListener("blur", function(e) { recognition.stop(); input.value=''; }); input.addEventListener('keypress', function (e) { recognition.stop(); var key = e.which || e.keyCode; if (key === 13) { // 13 is enter Program.execute(input.value); } }); } } }
在我的审判之下SpeachSynthesis
;
namespace CORE{ export interface IWindow extends Window{ SpeechSynthesisUtterance: any; SpeechSynthesis: any; } } namespace CORE{ export class speakSynthesis{ constructor(input:String){ if ('speechSynthesis' in window) { console.log('Your browser supports speech synthesis.'); // speak('hi'); } else { alert('Sorry your browser does not support speech synthesis. Try this in Google Chrome.'); } const {SpeechSynthesisUtterance}: IWindow =window; const {SpeechSynthesis}: IWindow = window; // Create a new instance of SpeechSynthesisUtterance. var msg = new SpeechSynthesisUtterance(); // Set the text. msg.text = input; // Set the attributes. msg.lang = 'en-US'; // msg.voice = 'native'; msg.voice = 'Google US English'; // 'Google UK English Female' msg.voice = 'Google US English' msg.volume = 1; msg.rate = 1; msg.pitch = 1; // msg.onend = function(event) { console.log('Speech complete'); } // Queue this utterance. var talk = new SpeechSynthesis(); window.talk.speak(msg); } } }
我到目前为止得到的确切错误如图所示。
多亏了这一点,我找到了speechSynthesis
将Window
变量添加到变量中的解决方案:
(window).speechSynthesis.speak(msg); // OR (window as any).talk.speak(msg);
此外,我在代码中发现了另一个错误,即:speechSynthesis
应该以small开头s
,我的错误是大写S
我喜欢发布答案,以防将来有人需要它。