angularjs empties array before populating with data?

Question

I am trying to find a way to minimize jsonp requests as angular does not cache these. My approach is to set the empty arrays I had in each controller into a main controller that loads once as it is attached to body. After that I will just check if the array is empty and if it is then use the service and return the json. My problem now is that for some reason that I do not understand the array is empty when checked outside of the service call.

example code

angular.module('Feed.controllers', [])
  .controller('MainCtrl', function($scope)
  {
    function getYear()
    {
      var currentDate = new Date();
      return currentDate.getFullYear();
    }
    $scope.currentYear = getYear();
    $scope.StandingsList = [];

  })
  .controller('StandingsCtrl', function($scope, APIservice, $routeParams)
  {
    console.log($scope.StandingsList.length); // returns 0

    if ($scope.StandingsList.length === 0)
    {
      APIservice.getSomtehing().success(function (response)
      {
          $scope.StandingsList = response.jsonData;
          console.log($scope.StandingsList.length); // returns total entries
      });
    };

    console.log($scope.StandingsList.length); // returns 0

  })

MainCtrl is in body tag as I am using the currentYear to various places in HTML StandingsCtrl is called using routes and partials for presentation. The div with the ng-view is inside the body element of MainCtrl

don't do that local caching in a controller, do that in a service.... and the reason why the array is empty is because every controller instantiates new $scope, so you are not pointing to the same variable — doodeec
– doodeec, Commented Mar 12, 2014 at 13:21
hmm if I am not pointing to same variable, then why if I delete the variable from MainCtrl I get Error: $scope.StandingsList is undefined, which is correct. — MentalRay
– MentalRay, Commented Mar 12, 2014 at 13:27
I'm not sure what you mean by 'deleting' variable, but two controllers don't share any scope variables, only when those are rootScope variables, both controllers will inherit them, as all scopes are descendants of the rootScope — doodeec
– doodeec, Commented Mar 12, 2014 at 13:31
I mean if I delete the line $scope.StandingsList = []; in MainCtrl, then I get the undefined error which means that StandingsCtrl uses StandingsList from MainCtrl. Am I wrong? — MentalRay
– MentalRay, Commented Mar 12, 2014 at 13:35
can you create a fiddle? it's hard to tell what's going on when I see only definition but not the usage in html — doodeec
– doodeec, Commented Mar 12, 2014 at 13:39

doodeec · Accepted Answer · 2014-03-12 13:26:30Z

the $scope of MainCtrl is not the same $scope as in StandingsCtrl, you might want to do something like this to share data between controllers

angular.module('Feed.controllers', [])
    .factory('Standings', function() {
        var list = [];
        return {
            save: function(data) { /*push data into list*/ },
            list: list
        }
    })
    .controller('MainCtrl', function ($scope, Standings) {
        function getYear() {
            var currentDate = new Date();
            return currentDate.getFullYear();
        }

        $scope.currentYear = getYear();
        $scope.StandingsList = Standings.list;
    })
    .controller('StandingsCtrl', function ($scope, APIservice, Standings) {
        console.log(Standings.list.length); // returns 0

        if (Standings.list.length === 0) {
            APIservice.getSomething().success(function (response) {
                Standings.save(response.jsonData);
                $scope.StandingsList = response.jsonData;
            });
        }

    });

Collectives™ on Stack Overflow

angularjs empties array before populating with data?

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