我是使用 angular6 的 webrtc 的新手。当我研究 WebRTC API 并构建一个简单的页面以在本地测试中显示/停止网络摄像头流时。我在开发中收到一条错误消息。有我的开发环境:
Angular 6.1.0
Angular-cli 6.1.2
Typescript 2.9.2
我构建了“停止”按钮来执行函数 stopBtn()。但是 typescript 编译器会在构建应用程序时抛出错误消息:
错误 TS2339:“MediaStream | 类型”上不存在属性“getTracks” Blob |媒体源”。类型“Blob”上不存在属性“getTracks”。
stopBtn() 函数代码:
private video: HTMLVideoElement;
.......
ngOnInit() {
this.video = <HTMLVideoElement>this.el.nativeElement.querySelector('#video');
}
........
getDevice() {.....}
getStream() {.....}
gotStream() {.....}
.......
stopBtn() {
if (this.video.srcObject) {
this.video.srcObject.getTracks().forEach( stream => stream.stop());
this.video.srcObject = null;
}
}
html简单代码:
<video id="video" autoplay></video>
<button id="stopbtn" type="button" (click)="stopBtn()">Stop</button>
此页面可以正确显示流。
我通过 stackoverflow 或 google 搜索了许多关键字来查找此错误消息。但不要得到任何好的答案。所以希望有人可以为我解决它。谢谢。
最佳答案
TypeScript 认为 this.video.srcObject
可以是 MediaStream
、Blob
或 MediaSource
,并且只有 MediaStream
具有 getTracks
方法,因此 TypeScript 警告您 this.video.srcObject
可能没有 getTracks
方法。如果你知道 this.video.srcObject
实际上是一个 MediaStream
,那么使用类型断言:
(<MediaStream>this.video.srcObject).getTracks().forEach( stream => stream.stop());
关于angular - getTracks 在 Angular 中通过 typescript 的类型 'Blob' 错误消息中不存在,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52200591/