Angular中的视频- TypeError问题
Angular中的视频- TypeError问题
提问于 2019-04-02 11:09:23
我正在尝试用Angular做一些基本的视频流工作。我的代码如下。挑战是我不断得到和错误地说...错误错误:未捕获(在promise中)：TypeError:无法读取未定义视频的属性‘TypeError’：无法读取未定义视频的属性‘video
如有任何建议，我们将不胜感激。
import {
Component,
OnInit,
ViewChild,
ElementRef
} from '@angular/core';
@Component({
selector: 'app-scanner',
templateUrl: './scanner.component.html',
styleUrls: ['./scanner.component.css']
})
export class ScannerComponent implements OnInit {
@ViewChild('video') video: HTMLMediaElement;
constructor() {}
ngOnInit() {
this.cameraCheck();
}
cameraCheck() {
navigator.mediaDevices
.getUserMedia({
video: {
facingMode: 'environment'
}
})
.then(function(stream) {
this.video.srcObject = stream;
this.video.setAttribute('playsinline', 'true'); // required to tell iOS safari we don't want fullscreen
this.video.play();
});
}
}<div>
<video #video></video>
</div>
回答 1
Stack Overflow用户
回答已采纳
发布于 2019-04-02 11:15:04
getUserMedia的promise句柄中的新function(stream)似乎没有获得正确的this引用。因此出现了错误。将其更改为使用箭头函数应该可以解决此问题。
示例：
cameraCheck() {
navigator.mediaDevices
.getUserMedia({
video: {
facingMode: 'environment'
}
})
.then((stream) => {
this.video.srcObject = stream;
this.video.setAttribute('playsinline', 'true'); // required to tell iOS safari we don't want fullscreen
this.video.play();
});
}
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/55466432
复制相关文章
相似问题
腾讯云开发者
