CODEWITHSUNDEEP
angularjsangularjs-serviceng-show
DrogoNevets
DrogoNevets

Reputation: 1575

Service variable not being watched

I have a service as thus

function() {
    this.show = false;

    this.toggle = function() {
        this.show = !this.show;
    }
}

and the menu has an ng-show looking at MenuService.show

this works perfectly, however I am trying make it so that when user clicks within the main page it sets show to false, thus, hiding the menu. I have this code

angular.element(document.getElementById("pages")).bind("click", function() {
    $scope.menuService.show = false;
});

but the ng-show doesnt seem to be taking any notice of show now being false and continues to show. What am I doing wrong?

Upvotes: 0

Views: 42

Answers (1)

Davin Tryon
Davin Tryon

Reputation: 67296

If you are binding to events (using bind) outside of Angular, then you need to $apply to run an Angular digest and update the scope:

angular.element(document.getElementById("pages")).bind("click", function() {
    $scope.menuService.show = false;
    $scope.$apply();
});

Upvotes: 1

Related Questions