JavaScript / AngularJS modify property in array

Question

I have the following AngularJS model:

$scope.Model = {
     Users : [{
         UserId: '',
         FirstName: '',
         LastName: ''
     }],
     Products :[{
         ProductId: '',
         Price: ''
     }]
};

If I populate this array with N users, and one user has id=1, how can I update that specific user (with id=1) the property LastName?

So for example if I will get a new AngularJS model:

$scope.UserToUpdate ={
   UserId: 1,
   LastName: "Smith"
};

I want to loop through the $scope.Model array and update the user with id=1 but only the FirstName property.

P.S. I don't know at what position the target user object in the array it is so basically can be at $scope.Model.Users[0] or $scope.Model.Users[1] or $scope.Model.Users[10] or at $scope.Model.Users[N] ...

your data structure is really strange, you have one object per array which is part of object in an array... hmmm — harishr
– harishr, Commented Nov 12, 2014 at 17:22

mikelt21 · Accepted Answer · 2014-11-12 17:54:57Z

3

You can just loop through your list of users

for (var i = 0; i < $scope.Model.Users.length; i++) {
    if($scope.Model.Users[i].UserId === $scope.UserToUpdate.UserId) {
        $scope.Model.Users[i].LastName = $scope.UserToUpdate.LastName;
        break;
    }
}

EDIT: Actually harish's answer is on to something too. Here's another solution using $filter:

var matchedUsers = $filter('filter')($scope.Model.Users, { UserId: $scope.UserToUpdate.UserId });
if (matchedUsers.length > 0) {
    matchedUsers[0].LastName = $scope.UserToUpdate.LastName;
}

And don't forget to add the $filter service as a parameter in your controller declaration for this second solution.

edited Nov 12, 2014 at 17:54

answered Nov 12, 2014 at 17:33

mikelt21

2,7784 gold badges26 silver badges35 bronze badges

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

Comments

Amir Popovich · Accepted Answer · 2014-11-12 17:22:32Z

0

$scope.UserToUpdate = 
   $scope.Model.Users.filter(function(user) { return user.FirstName == "test"; })[0];

BTW: you can add a check if the user exists..

answered Nov 12, 2014 at 17:22

Amir Popovich

30.1k9 gold badges58 silver badges102 bronze badges

2 Comments

David Dury Over a year ago

Alright so that will basically will return the actual user object. How do I update it in place?

Amir Popovich Over a year ago

You have a reference to the "wanted" object. Now you can update it via javascript or add a template with ng-model to update it via inputs.

harishr · Accepted Answer · 2014-11-12 17:34:34Z

0

you can use $filter

      var user = $filter('filter')($scope.Model.Users, 'UserId == 1');

you are read more about $filter('filter') here

answered Nov 12, 2014 at 17:34

harishr

18.1k9 gold badges84 silver badges131 bronze badges

Comments

Asik · Accepted Answer · 2014-11-12 17:44:49Z

0

Try this! working demo http://plnkr.co/edit/scyV79HqqA7nOG9h4ezH?p=preview . Please check the console log.

angular.forEach($scope.Model[0].Users, function(value1, key1) {
    var i = 0;
    angular.forEach(value1, function(value, key) {
      if (key == 'UserId' && $scope.UserToUpdate.UserId == value) {
        $scope.Model[0].Users[i].LastName = $scope.UserToUpdate.LastName;
      }
      i++;
    });

  });

The above code updating the Model object LastName property based on UserToUpdate object (id=1)

edited Nov 12, 2014 at 17:44

answered Nov 12, 2014 at 17:38

Asik

7,9674 gold badges30 silver badges35 bronze badges

Collectives™ on Stack Overflow

JavaScript / AngularJS modify property in array

4 Answers 4

Comments

2 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related