Running function again after route change in AngularJS

Question

So I have a main controller and two others:

calculatorApp.controller('companybController', function($scope, $http) {
  //define the hardware data
  $scope.customs.prodoc = 'companyb';
});

calculatorApp.controller('companyaController', function($scope, $http) {
  $scope.customs.prodoc = 'companya';
});

// create the controller and inject Angular's $scope
calculatorApp.controller('mainController', function($scope, $http) {
  $scope.customs = {
    prodoc : ''
  };
});

But when switching routes - this works: {{customs.prodoc}}, but it seems the function that uses it does not run again when the new view is loaded - causing the app to use the old values.

How do I run the function that uses the changing $scope.customs.prodoc again once the view has been changed?

Here's the function that uses it - I had it in mainController but not sure it belongs there.

$http.get($scope.customs.prodoc+'/products.json').success(function(thisdata) {
        $scope.products = []
        angular.forEach(thisdata, function(product) {
            $scope.products.push(product);
        });
        console.log($scope.products);
    });

$scope.change = function() {
// Suggest product
        $scope.suggested = {}
        var length = ($scope.products).length;
        for(i=0; i<length; i++){
            if($scope.products[i].CAMERA_MAX>=$scope.totals.cameras){
                $scope.suggested = $scope.products[i];
                break;
            }else{

            }

        }
}

Are you sure that the controller is executed? Can you post a more complete example? — Davide Icardi
– Davide Icardi, Commented Feb 18, 2014 at 22:08
@DavideIcardi I'm sure the controller is executed because I can use the variable on its own (and it shows the new variable from the current controller.) But the functions that use that variable don't run again. Which is what I'm trying to solve. — itamar
– itamar, Commented Feb 18, 2014 at 22:09
@IlanFrumer Hi again, Ilan! I posted more code in the question. — itamar
– itamar, Commented Feb 18, 2014 at 22:10

koolunix · Accepted Answer · 2014-02-18 22:19:20Z

4

I would use $routeChangeSuccess to do what you are talking about

$scope.$on("$routeChangeSuccess", function($currentRoute, $previousRoute) {
    $scope.customs.prodoc = $scope.routeParams.prodoc;
});

answered Feb 18, 2014 at 22:19

koolunix

1,99516 silver badges25 bronze badges

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

3 Comments

itamar Over a year ago

Cool - where would I put this, though? In the calculatorApp.config?

itamar Over a year ago

Thank you - this worked perfectly once I plugged it into the two controllers and ran $scope.change()

mila Over a year ago

@itamar you just need to put it in the destination controller.

Collectives™ on Stack Overflow

Running function again after route change in AngularJS

1 Answer 1

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related