How to add dynamic property in angularjs object

Question

I have object

$scope.postData = {
  'pmu.messages.message': $scope.upd.message,
  'pmu.received.id': $scope.upd.atomByReceivedBy.id,
};

and in scope there is $scope.ImageList which contains image path array

[
  { img: 'a.jpg', smallimg: 'b.jpg', smpath: 'c.jpg' },
  { img: 'a1.jpg', smallimg: 'b1.jpg', smpath: 'c1.jpg' },
];

I want to add these array value to $scope.postData field property value as

$scope.postData = {
   'pmu.messages.message': $scope.upd.message,
   'pmu.received.id': $scope.upd.atomByReceivedBy.id,
   'pmu.image[0].img':
   'pmu.image[0].smallimg':
   'pmu.image[0].smimg':
   'pmu.image[1].img':
   'pmu.image[1].smallimg':
   'pmu.image[1].smimg':
}

How to achieve this?

Satpal · Accepted Answer · 2019-03-28 07:50:37Z

1

Iterate $scope.ImageList and use Bracket Notation to create properties.

Here in the example, I have used just one property

$scope.ImageList.forEach(function(element, index){
    $scope.postData['pmu.image[' + index +'].img'] = element.img;
});

answered Mar 28, 2019 at 7:50

Satpal

134k13 gold badges168 silver badges171 bronze badges

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

Comments

felixmosh · Accepted Answer · 2019-03-28 07:55:53Z

1

You can iterate the array with Array.forEach, and then extract the key & value of each image using Object.entries.

$scope = {
  upd: {
    message: '',
    atomByReceivedBy: {
      id: ''
    }
  },
  ImageList: [{
      img: 'a.jpg',
      smallimg: 'b.jpg',
      smpath: 'c.jpg'
    },
    {
      img: 'a1.jpg',
      smallimg: 'b1.jpg',
      smpath: 'c1.jpg'
    },
  ]
}

$scope.postData = {
  'pmu.messages.message': $scope.upd.message,
  'pmu.received.id': $scope.upd.atomByReceivedBy.id,
};

$scope.ImageList.forEach((img, index) => {
  Object.entries(img).forEach(([key, value]) => {
    $scope.postData[`pmu.image[${index}].${key}`] = value;
  });
});

console.log($scope.postData);

answered Mar 28, 2019 at 7:55

felixmosh

35.8k10 gold badges81 silver badges99 bronze badges

1 Comment

xrcwrn Over a year ago

Working properly

Collectives™ on Stack Overflow

How to add dynamic property in angularjs object

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