3

I've got an array of objects array = [object1, object2, ...], each of them has some keys object1 = { key1: 'value1', ... }. I want to add a key this way:

$rootScope.array[i].newKey = 'someValue'

But angular tells me that $rootScope.array[i] is undefined.

What I've noticed from console is that the objects get the new key but the console still says the same.

3
  • did you add the array to your $rootScope ? like $rootScope.array = array; Commented Mar 30, 2016 at 14:38
  • yes actually I do $rootScope.meatTypes = [{}]; Commented Mar 30, 2016 at 14:44
  • this means that meat types is an array that contains one empty object. To declare an empty array just use $rootScope.meatTypes = [] Commented Mar 30, 2016 at 14:59

4 Answers 4

3

You should use less than and not less or equal than comparator.

  $scope.init = function () {
        for (i = 0; i < /* not <= */ $rootScope.meatTypes.length; i++) {
            console.log("I am showing the meatypes:");
            console.log($rootScope.meatTypes);
            $rootScope.meatTypes[i].counter = '0';
            counterOperations.setCounters(i, 0);
        }
        $rootScope.total = 0;
        counterOperations.setTopCounter(0);
    };

because when i equals $rootScope.meatTypes.length then $rootScope.meatTypes[i] is undefined.

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

Comments

2

You are trying to access a member of the array that does not exist.

You need to create a new object and push it onto the array:

$rootScope.array.push({'key1': 'someValue'});

2 Comments

I need to create a new key in an existing object of my array not to create a new object.
When I actually do this my browser crashes: ` $scope.init = function () { for (i = 0; i <= $rootScope.meatTypes.length; i++) { console.log("I am showing the meatypes:"); console.log($rootScope.meatTypes); $rootScope.meatTypes.push({'counter':0}); counterOperations.setCounters(i, 0); } $rootScope.total = 0; counterOperations.setTopCounter(0); }; `
1

You did not mention lodash, but when I see someone encounter an issue like this, I want to offer the recommendation of using lodash (or underscore.js).

With lodash, you would do something like so, using _.set, which defensively protects against your described issue by automatically adding the necessary elements in the path:

_.set($rootScope, ['array', i, 'newKey'], 'someValue');

This library, properly utilized, solves many issues that you can have with setting and getting variables, ase well as other super useful tools. It has been a major life-saver (and time-saver) for us on our projects.

Comments

0

Like this you can add

$rootScope.array[i] = {}; // first we should create an object on that array location
$rootScope.array[i]['newKey'] = 'someValue'; // then only we can add values

EDIT:

$scope.init = function () {
    for (i = 0; i <= $rootScope.meatTypes.length; i++) {
        console.log("I am showing the meatypes:");
        console.log($rootScope.meatTypes);
        **// This is needed**
        $rootScope.meatTypes[i]={};// here we should tell that metaType[newItem] is an object other wise it treat it as undefined
        $rootScope.meatTypes[i].counter = '0';
        counterOperations.setCounters(i, 0);
    }
    $rootScope.total = 0;
    counterOperations.setTopCounter(0);
};

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.