angularjs.forEach second iteration fails to set object property

Question

I have the following object with nesting array:

var foobar = {
        "foo1": ["bar1", "bar2"],
        "foo2": ["bar3", "bar4"]
        }

I need to convert it to:

{
    "foo1": {"bar1":"bar1", "bar2":"bar2"},
    "foo2": {"bar3":"bar3", "bar4":"bar4"}
}

The function below iterates through the first element of the object successfully:

$scope.regonal = {};

angular.forEach(foobar, function(value, key) {
    angular.forEach(value, function(v) {

        $scope.regonal[key][v] = v;

    });
});

... but fails on the second with error:

TypeError: Cannot set property 'bar3' of undefined

where does foo3 magically appear from? Is that a typo?

charlietfl
– charlietfl

2015-10-26 18:54:51 +00:00
Commented Oct 26, 2015 at 18:54 — charlietfl
– charlietfl, Commented Oct 26, 2015 at 18:54
sorry, typo, corrected...

qwaz
– qwaz

2015-10-26 18:56:59 +00:00
Commented Oct 26, 2015 at 18:56 — qwaz
– qwaz, Commented Oct 26, 2015 at 18:56

Etse · Accepted Answer · 2015-10-26 18:52:40Z

2

$scope.regonal is an empty object, that means that the result of $scope.regonal[key] will be undefined. Trying to access $scope.regonal[key]["bar3"] means you try to access and set the key bar3 on undefined.

try this:

$scope.regonal = {};

angular.forEach(foobar, function(value, key) {
    $scope.regonal[key] = {};
    angular.forEach(value, function(v) {
        $scope.regonal[key][v] = v;

    });
});

answered Oct 26, 2015 at 18:52

Etse

1,2451 gold badge15 silver badges28 bronze badges

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

Comments

Oleksandr T. · Accepted Answer · 2015-10-26 18:57:50Z

2

You get error because $scope.regonal[key] (there is not any property in $scope.regonal with keys foo1 and foo2) is undefined, you should set it as empty object,

var foobar = {
  "foo1": ["bar1", "bar2"],
  "foo2": ["bar3", "bar4"]
};

var $scope = {}; // just for example 

$scope.regonal = {};

angular.forEach(foobar, function(value, key) {
  $scope.regonal[key] = {};

  angular.forEach(value, function(v) {
    $scope.regonal[key][v] = v;
  });
});

console.log($scope.regonal);

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.7/angular.js"></script>

edited Oct 26, 2015 at 18:57

answered Oct 26, 2015 at 18:51

Oleksandr T.

77.6k17 gold badges177 silver badges145 bronze badges

Comments

charlietfl · Accepted Answer · 2015-10-26 19:01:05Z

1

for(key in foobar){
    $scope.regional[key] = foobar[key].reduce(function(obj, curr){
        obj[curr] = curr;
        return obj;        
    },{});    
}

DEMO

answered Oct 26, 2015 at 19:01

charlietfl

172k14 gold badges125 silver badges154 bronze badges

Comments

Shubham Aggarwal · Accepted Answer · 2015-10-26 19:12:19Z

0

$scope.regonal[key] returns undefined because there is no key named foo1 or foo 2 in regonal. You can create keys by either $scope.regonal[key]={} or $scope.regonal.key={}

answered Oct 26, 2015 at 19:12

Shubham Aggarwal

3532 silver badges16 bronze badges

Collectives™ on Stack Overflow

angularjs.forEach second iteration fails to set object property

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related