尝试在带有 IWindow 接口的 Angular2 中使用 speechSynthesis

Question

我正在尝试使用 speechSynthesis http://blog.teamtreehouse.com/getting-started-speech-synthesis-api

首先我用接口扩展了window：

window.interface.ts

export interface IWindow extends Window {
  webkitSpeechRecognition: any;
  speechSynthesis: any;
}

接下来我做了一个window服务：

window.service.ts

import { Injectable } from '@angular/core';
import { IWindow } from '../interfaces/window-interface';

function _window() : IWindow {
   return window;
}
@Injectable()
export class WindowService {
   get nativeWindow() : any {
      return _window();
   }
}

现在在组件中，我正在尝试实现它....没有成功..

app.component

import { Component, OnInit, ViewChild } from '@angular/core';
import { WindowService } from '../../providers/window.service';
@Component({
    selector: 'app-root',
    templateUrl: './app.component.html',
    styleUrls: ['.app.component.scss']
})
export class AppComponent implements OnInit {
   constructor(private _router: Router, private _window: WindowService ) { }

   sayIt() {
      var utterance = new SpeechSynthesisUtterance('Hello World');
      this._window.speechSynthesis.speak(utterance);
   }
}

TS 错误：

Cannot find name 'SpeechSynthesisUtterance'.)
Property 'speechSynthesis' does not exist on type 'WindowService'.)

我也参考了这篇关于语音识别的文章：

仍然出现错误 -- 属性 'speechSynthesis' 在类型 'Window'

上不存在

Answer 1

可以按照下面的方式进行

 var msg = new SpeechSynthesisUtterance("hello world");
 (<any>window).speechSynthesis.speak(msg)

得到了 link

的帮助

尝试在带有 IWindow 接口的 Angular2 中使用 speechSynthesis

Trying to use speechSynthesis in Angular2 with IWindow Interface

window

interface

speech-synthesis

angular2-services

angular