How to get the values and put them in array angularjs

Question

Here is my html: I have an object with arrays of items. I need to add a new array with values from inputs.

<div ng-repeat="item in contact.items">
  <label for="Title">Title</label>
  <select id="Title" ng-model="item.title">
    <option ng-selected="title.value === item.title" ng-repeat="title in titles">
      {{ title.title }}
    </option>
  </select>
</div>
<div class="row">
  <label for="Name"> Name</label>
  <input type="text" id="Name" placeholder="Name" ng-model="item.name">
</div>
<div class="row">
  <a ng-click="addItem();">Save Item</a>
</div>

Here is the controller:

$scope.addItem = function() {
  $scope.contact.items.push({
    name: "",
    title:""
  });
  console.log( $scope.contact.items);
};

It is ok when I push the empty array, but it fails when I try pushing the values form the ng-model:

$scope.addItem = function() {
    $scope.contact.items.push({
        name: $scope.item.name,
        title:$scope.item.title
    });
    console.log( $scope.contact.items);
};

What am I missing?

How should a user specify a title for a new item?

raina77ow
– raina77ow

2015-03-26 09:54:17 +00:00
Commented Mar 26, 2015 at 9:54 — raina77ow
– raina77ow, Commented Mar 26, 2015 at 9:54
Can you setup the code on plnker?

Anil Singh
– Anil Singh

2015-03-26 10:19:27 +00:00
Commented Mar 26, 2015 at 10:19 — Anil Singh
– Anil Singh, Commented Mar 26, 2015 at 10:19

H. Pauwelyn · Accepted Answer · 2017-12-08 16:32:31Z

3

You need to store the values in an object and then push it to array.

$scope.item = {};
$scope.addItem = function() {
    var newItem = {};
    newItem.name = $scope.item.name;
    newItem.title = $scope.item.title;
    $scope.contact.items.push(newItem);
    console.log($scope.contact.items);
};

edited Dec 8, 2017 at 16:32

H. Pauwelyn

14.4k28 gold badges93 silver badges164 bronze badges

answered Mar 26, 2015 at 9:55

M.S.

4,4531 gold badge22 silver badges43 bronze badges

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

2 Comments

Sam Lewis Over a year ago

I'm getting an error "Cannot read property 'name' of undefined' :(

M.S. Over a year ago

You have to define item in $scope. Please see my updated answer.

Collectives™ on Stack Overflow

How to get the values and put them in array angularjs

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