我能够通过创建如下所示的界面在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
。供参考,以下是我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 = <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 <a href="https://www.google.com/chrome/browser/desktop/index.html">Google Chrome</a>.');
}
const {SpeechSynthesisUtterance}: IWindow = <IWindow>window;
const {SpeechSynthesis}: IWindow = <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);
}
}
}
到目前为止我得到的确切错误如图所示。
答案 0 :(得分:4)
感谢this,我找到了将speechSynthesis
添加到Window
变量的解决方案:
(<any>window).speechSynthesis.speak(msg);
// OR
(window as any).talk.speak(msg);
此外,我在代码中发现了另一个错误,即:speechSynthesis
应该以小s
开头,我的错误是大写S
我喜欢发布答案,以防将来有人需要它。