callback function in AngularJS

Question

I m trying to assign value to variable in a callback function. How much i know callback functions are asynchronous so i tried to do with scope.apply but it doesnt seems to work.. Any ideas ?

angular.module("sadf")

    .factory("browsersCameraSupportService", function ($scope, $apply ) {

        return {

            supportsGetUserMedia: function () {

                navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia;
                var hasCam = true;
                if (navigator.getUserMedia) {
                    navigator.getUserMedia({video: true}, function(localMediaStream){

                    }, function(){

                        $scope.$apply(function(){
                            hasCam = false;
                        });
                    });
                }
                return angular.isDefined(navigator.getUserMedia)&& hasCam;
            }
        };
    });

$scope.apply doesn't change the fact that return angular.isDefined(navigator.getUserMedia)&& hasCam; happened long bfore hasCam was set to false. — user400654
– user400654, Commented Oct 22, 2015 at 15:19
What are you trying to accomplish from a larger perspective? You haven't really explained what's going on. Angular uses a lot of promises which handle async callbacks. — ryanyuyu
– ryanyuyu, Commented Oct 22, 2015 at 15:20
just trying to assign a value into hasCam before return works.. — Akin Dönmez
– Akin Dönmez, Commented Oct 22, 2015 at 15:21

dfsq · Accepted Answer · 2015-10-22 15:31:42Z

This is the case where using $apply is not what you need. Since check for media is asynchronous operation it is convenient to return a promise object and work with it in consuming code. Then your service will become:

angular.module("sadf")

.factory("browsersCameraSupportService", function($q) {

    return {

        supportsGetUserMedia: function() {

            navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia;

            return $q(function(resolve, reject) {
                if (navigator.getUserMedia) {
                    navigator.getUserMedia({video: true}, function(localMediaStream) {
                        return resolve(true);
                    }, function() {
                        return resolve(false);
                    });
                }
            });
        }
    };
});

and usage is simple:

browsersCameraSupportService.supportsGetUserMedia().then(function(supported) {
    if (!supported) {
        alert('Video is not supported.');
    }
});

Demo: http://plnkr.co/edit/BTj6deHrIvKa2VK3Kn1M?p=preview

Collectives™ on Stack Overflow

callback function in AngularJS

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related