CODEWITHSUNDEEP
javascriptangularjsobject
Maverick
Maverick

Reputation: 59

How can I update my Object with selected inputs in ng-repeat?

I have code like this

{"xyz":[{"a":1,"b":"","c":""}],
"pqr":["l","m"],
"abc":["1234","5678"]}

<div ng-model="item" ng-repeat="product in xyz">
    <div>{product.a}</div>
    <div>
        <select>
            <option ng-repeat="value in pqr">{{value}}</option>
        </select>
    </div>
    <div>
        <select>
            <option ng-repeat="number in abc">{{number}}</option>
        </select>
    </div>
</div>

I want to update my object on changing the values in dropdowns and update the onject "xyz"!

Upvotes: 0

Views: 22

Answers (2)

Hadi
Hadi

Reputation: 17289

try like this.

you should define model for select tag.

var app = angular.module("app",[]);

app.controller("MyCtrl" , function($scope){
  
    $scope.data = 
        {
      
         "xyz":[{"a":1,"b":"","c":""}],
         "pqr":["l","m"],
         "abc":["1234","5678"]
       }
  
  });
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" ng-controller="MyCtrl">
   <div ng-repeat="(key,value) in data.xyz">
    <div ng-repeat="(k,v) in value">{{v}}</div>
    <div>
        <select ng-model="model1" ng-options="v1 as v1 for v1 in data.pqr" ng-change="value.b = model1">
        </select>
    </div>
    <div>
        <select ng-model="model2" ng-options="number as number for number in data.abc" ng-change="value.c = model2">
        </select>
    </div>
</div>
</div>

Upvotes: 1

JanR
JanR

Reputation: 6132

First of all don't use ng-repeat on <option> use ng-options instead. Documentation and examples can be found here: https://docs.angularjs.org/api/ng/directive/ngOptions

As for your code, you will need to bind the select to your object:

<select ng-model="product.a" ...> //or which ever property you are trying to update

Upvotes: 0

Related Questions