AngularJS - $rootScope variable initialization fails

Question

I'm trying to initialize a $rootScope array variable (arrayX) and use it in a $rootScope function in the same controller (controllerA).

The reason i'm using $rootScope instead of $scope for this variable and this function is that i'm planning to call them from another controller later.

The problem is that when I call the controller's $rootScope function i get a 'Uncaught TypeError: data.push is not a function etc.'

I believe that even if i declared the $rootScope arrayX = [] variable, this initialization is ignored or not recognized when I call the function. Can anyone explain me why I got this error and what i'm missing about the $rootScope concept? Thanks

THE CODE

angular.module('myApp')
  .controller('mainCtrl', function ($scope, $rootScope, $uibModal) {

//does this count as a valid variable initialization? 
$rootScope.localCart = [];

$rootScope.pushToCart = function (obj) {

    $rootScope.localCart.push(obj); //TYPEERROR
    ....

If i re-declare $rootScope.localCart in $rootScope.pushToCart function, things will be fine

    $rootScope.pushToCart = function (obj) {
        $rootScope.localCart = [];
        $rootScope.localCart.push(obj); // OK!
        ...

There's something i'm missing. Why is the outside-function initialization ignored? I thought that declare $rootScope variables in advance could be a nice idea (in order to avoid in-function declaration and confusion with other $scope variables...)

EDIT: Thanks everyone for the service suggestion. I'll try it as soon as possible (I need to sleep!) It's just that... I really wanted to understand why the $rootScope variable init. fails/is not recognized when I call the push method from the function.

$rootScope should be left alone in almost all cases. Why do you need it here? — lux
– lux, Commented Nov 24, 2015 at 22:26
You should be adding this logic into a service instead and then inject the service into other controllers where it's needed — mindparse
– mindparse, Commented Nov 24, 2015 at 22:27
Try using $scope instead of $rootScope, that'd be already better (and eventually create a service indeed) — floribon
– floribon, Commented Nov 24, 2015 at 22:44
Thanks for the suggestions, i'll try with a service asap. I also tried with $scope before and the initialization worked fine. I just wanted to understand why the $rootScope variabile init. doesn't work. — Mirco Lcl
– Mirco Lcl, Commented Nov 24, 2015 at 22:46

Leandro Zubrezki · Accepted Answer · 2015-11-24 23:08:43Z

1

If you are going to use $rootScope I would suggest to do the definition of the array and the function declaration into the run block, and then use it in the controller. So you can be sure that when you use the function, both are declared.

But, you should be doing this in a services as many pointed out.

answered Nov 24, 2015 at 23:08

Leandro Zubrezki

1,1609 silver badges13 bronze badges

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

Comments

mindparse · Accepted Answer · 2015-11-24 22:32:14Z

1

You have two different named variables, one is localCart and the other is localCartUser.

In your first snippet you declare localCart but then you try to push into an undeclared localCartUser variable.

Don't add reusable functionality on rootScope instead use a service (see my comment)

answered Nov 24, 2015 at 22:32

mindparse

7,59529 gold badges105 silver badges217 bronze badges

1 Comment

Mirco Lcl Over a year ago

Sorry man, my fault. I tryed to summarize the code and made confusion with the variables name. Originally I had 2 arrays, but the problem remains. Please check my edited code.

Collectives™ on Stack Overflow

AngularJS - $rootScope variable initialization fails

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related