CODEWITHSUNDEEP
angularjsjson
Pardha
Pardha

Reputation: 415

dropdown is not populating with json object

my ng-model value is - "{"Id":1,"Description":"Draft","Code":"Draft"}" and ng-options are -

[
   {
      "Id": 1,
      "Description": "Draft",
      "Code": "Draft"
   },
   {
      "Id": 2,
      "Description": "UserSubmitted",
      "Code": "UserSubmitted"
   },
   {
      "Id": 3,
      "Description": "PLMApproved",
      "Code": "PLMApproved"
   }
]

so my dropdown is not populating(but value is binding).

I understatnd, if ng-model values is just a integer value it would bind, then how about json object? Please help needed.

Upvotes: 0

Views: 107

Answers (1)

Abdul Mateen Mohammed
Abdul Mateen Mohammed

Reputation: 1894

AFAIK it won't bind because your model is a different object i.e. points to a different memory location and it doesn't match with any objects inside the array.

You could use the as clause in ng-options to select a property you want to get into the ng-model and setting ng-model with that value will set the selected option.

e.g.

<select ng-options="item.Id as item.Description for item in default.items" ng-model="default.selectedItemId">
      <option value="">Select</option>
    </select>

else you could use the track by clause which is used when you want to get one property or object into your ng-model but you want to set the selected option with another property from the ng-model which will be specified in the track by clause i.e. update the binding from code to the view

e.g.

<select ng-options="item as item.Description for item in default.items track by item.Id" ng-model="default.selectedItem">
      <option value="">Select</option>
    </select>

Upvotes: 1

Related Questions