Javascript 如何使用getUserMedia流中的数据更新角度绑定？

我正在使用getUserMedia获取音频流。音频流仅在getUserMedia的回调中可用。但是，当我尝试从回调内部更新绑定时，angular不会检测到更改，也不会更新绑定。我尝试过使用$scope.$apply，正如许多文章所建议的那样，但它似乎没有任何作用

这是一把小提琴，它显示了我的努力。

---

$scope.$apply

按预期工作。但是，

此

的范围是指内部lambda函数的范围，而不是首先声明

设备状态

的外部函数的范围。因此，

getUserMedia

回调创建一个新的

deviceStatus

变量，而不是更改原始变量（UI绑定到该变量）。尝试存储对原始

this

的引用，并在内部lambda函数中引用

deviceStatus

时使用它：

angular.module('test', [])
    .controller('mainController', function ($scope) {
        var that = this;
        that.deviceStatus = "Angular works.";
        that.deviceStatus = "We can update a binding.";
        navigator.mediaDevices.getUserMedia({
            audio: true,
            video: false
        }).then(function (stream) {
            that.deviceStatus = "*Now* angular detects this change.";
            $scope.$apply(function (stream) {
                that.deviceStatus = "I even tried scope.apply!";
                alert("But I know this code is executing");
            });
       });
});

---

。

getUserMedia

函数已替换为

setTimeout

，因为该函数似乎对我不起作用。

啊，我误解了变量是如何关闭的。谢谢

angular.module('test', [])
    .controller('mainController', function ($scope) {
        var that = this;
        that.deviceStatus = "Angular works.";
        that.deviceStatus = "We can update a binding.";
        navigator.mediaDevices.getUserMedia({
            audio: true,
            video: false
        }).then(function (stream) {
            that.deviceStatus = "*Now* angular detects this change.";
            $scope.$apply(function (stream) {
                that.deviceStatus = "I even tried scope.apply!";
                alert("But I know this code is executing");
            });
       });
});