如何使用AngularJS进行网络摄像头操作？

Question

以前我把工作的网络摄像头代码放到我的应用程序中,但是现在当我更新到AngularJS v1.5.0时它不起作用.我正在使用与v1.3.0完美配合的webcam-directive.

这是我的代码:

<webcam placeholder="selfiePlaceHolder"
  on-stream="onStream(stream)"
  on-access-denied="onError(err)" on-streaming="onSuccess(video)">
</webcam>

但是现在它给AngularJS v1.5.0带来了以下错误:

未捕获的错误:[$ parse:isecdom]不允许在Angular表达式中引用DOM节点!表达式:onSuccess(视频) http://errors.angularjs.org/1.5.0/ $ parse/isecdom？p0 = onSuccess(视频)

我也试着使用不同的解决方案AngularJS NG-摄像头,但即使它的演示页是不是为我工作.

注意: 我知道问题是我们无法从较新版本的AngularJS访问DOM,但相同的代码适用于旧版本.我需要知道如何将"Video"DOM对象传递给控制器​​.

Answer 1

我找到了问题的解决方案:需要做两件事:

首先是HTML:

<webcam channel="channel" 
        on-streaming="onSuccess()" 
        on-error="onError(err)" 
        on-stream="onStream(stream)"></webcam>

在控制器中,您可以访问DOM视频:

 $scope.onSuccess = function () {
        // The video element contains the captured camera data
        _video = $scope.channel.video;
        $scope.$apply(function() {
            $scope.patOpts.w = _video.width;
            $scope.patOpts.h = _video.height;
            //$scope.showDemos = true;
        });
    };

这是工作实例 ..