AngularJS : Display a property value of multiple objects in an input text field, comma separated

Question

I have an array of JSON objects in the format

users=[{id:'1',name:'ABC'},{id:'2',name:'DEF'},............]

I need to display the names of all users in an input text field comma separated as below image.

I tried using ng-list directive, but for that I had to first loop through the user objects and store all the names in a separate array and use that array as ng-model for the <input> element. Is there an easy, alternate way in angularjs?

Vinod Louis · Accepted Answer · 2016-11-22 07:04:44Z

2

A simple JS solution Use Map function to get the desired property in array then use a join over it

 var users=[{id:'1',name:'ABC'},{id:'2',name:'DEF'}];

 $scope.userModel = users.map(function(el){return el.name}).join(",");

 <input type="text" ng-model="userModel">

edited Nov 22, 2016 at 7:04

answered Nov 22, 2016 at 6:55

Vinod Louis

4,9061 gold badge31 silver badges50 bronze badges

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

2 Comments

geekbro Over a year ago

<input type="text" ng-model="usermodel" /> and in angular you can assign as $scope.usermodel=users.map(function(el){return el.name}).join(",") @sreehari

impregnable fiend Over a year ago

$scope.userModel = users.map((e) => e.name).join(","); :)

Collectives™ on Stack Overflow

AngularJS : Display a property value of multiple objects in an input text field, comma separated

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related