Angular scope not binding

Question

I have a template like this:

    <div class="modal top am-fade-and-slide-top" tabindex="-1" role="dialog"
 style="display: block;" ng-init="bindHide($hide)">

displaying something here....
</div>

And in the controller, it's looks like:

angular.module('coreApp').controller('incomingCallController',['$scope','$rootScope','$http','$ocLazyLoad','$modal',function($scope,$rootScope,$http,$lazyLoad,$modal){
    var session = $rootScope.videoSession;
    //$rootScope.videoSession.accept();

    $scope.callerData =
    {
        'username': $rootScope.videoSession.request.getHeader('userName'),
        'profileimage':  $rootScope.videoSession.request.getHeader('profileImage')
    }
    $scope.rejectCall = function(){
        session.reject();
    }

    session.on('cancel',function(){
        $scope.hideModal(); //-----------Doesn't work here
    });

    $scope.bindHide = function(hideModal){
        $scope.hideModal = hideModal;

        //$scope.hideModal() ---- works fine here  
    }
}])

The binding doesn't work in the callback. Why so?

Pankaj Parkar · Accepted Answer · 2015-09-11 21:50:46Z

3

You need to apply digest cycle manually to update bindings, because you are calling angular code from out of angular context.

Code

session.on('cancel',function(){
    $scope.$apply(function(){
        $scope.hideModal();
    })
});

Rather than above $timeout would be more safer way to run the code.

edited Sep 11, 2015 at 21:50

answered Sep 9, 2015 at 22:49

Pankaj Parkar

136k23 gold badges241 silver badges307 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Angular scope not binding

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