AngularJS switch path when user scroll

Question

I try to detect when the user scroll the view and then I would like to switch view.

I'm using a directive for detect when the user scroll :

.directive("scroll", function ($window) {
return function(scope, element, attrs) {
    angular.element($window).bind("scroll", function() {
        if (this.pageYOffset >= 1) {
            scope.boolChangeClass = true;
            console.log('Scrolled down');
        } else {
            scope.boolChangeClass = false;
            console.log('Scroll up');
        }
        scope.$apply();
    });
};

The directive is called on the div with the ng-controller

<div scroll ng-controller="MyCtrl1">

I get the boolChangeClass in the view of Controller 1

   <span>{{boolChangeClass}}</span>

And log the result in my controller

myApp.controller('MyCtrl1', ['$scope', '$http', function($scope, http) {
   console.log($scope.boolChangeClass);
}]);

How can I detect in my controller that boolChangeClass have changed and then I would like to go to controller2 ?

Aju John · Accepted Answer · 2017-07-20 07:48:45Z

1

Use $watch to detect any change in the scope variable.

myApp.controller('MyCtrl1', ['$scope', '$http', function($scope, http) {
   console.log($scope.boolChangeClass);

   $scope.$watch(function(){
       return $scope.boolChangeClass;
   }. function() {
      console.log($scope.boolChangeClass); // will be called when the values gets changed
   })

}]);

answered Jul 20, 2017 at 7:48

Aju John

2,2441 gold badge14 silver badges27 bronze badges

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

Comments

Muhammad Imran · Accepted Answer · 2017-07-20 08:32:05Z

0

This is where you should use services to share data among different controllers..

Or if you really want to do in simple, just define a baseController in upper root div and define your boolChaneClass in that baseController so its accessible from both child controllers (ctrl1, ctrl2 ...)

answered Jul 20, 2017 at 8:32

Muhammad Imran

1517 bronze badges

Collectives™ on Stack Overflow

AngularJS switch path when user scroll

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related