ng-repeat中的Json Object

Question

response object like

$scope.list= [
Object {
  cid=74,
  date="2016-08-25T00:00:00.000+0530",
  optkey="key",
  optvalue="{
    value:{
      'name':test,
      'gender':male
    }
  }"
},
Object {
 cid=75,
 date="2016-08-25T00:00:00.000+0530",
 optkey="key",
 optvalue="{
   value:{
     'name':test2,
     'gender':female
   }
 }"
}},
Object {
  cid=77,
  date="2016-08-26T00:00:00.000+0530",
  optkey="key",
  optvalue="{
    value:{
      'name':test1,
      'gender':female
    }
  }"
}]

and in html page used ng-repeat

<div ng-repeat="item in list">
  {{item.date}} -- works fine
</div>

here how to display json value in object optvalue, done some code like.

<div ng-repeat="item in list">
  {{item.optvalue.value}} -- but it is undefined
</div>

but it is not working can any one give hint for this

Answer 1

Just because your optvalue is a String but not a object. It should be :

optvalue = {
    value:{
      'name':test1,
      'gender':female
    }
}

In JSON, an object should NOT be in the parenthese.

Answer 2

Try this working example, please check the object created.

 var app = angular.module('myApp', []); app.controller('myCtrl', function($scope) { $scope.list= [ { cid:74, date:"2016-08-25T00:00:00.000+0530", optkey:"key", optvalue:{value:{'name':'test','gender':'male'}} }, { cid:75, date:"2016-08-25T00:00:00.000+0530", optkey:"key", optvalue:{value:{'name':'test','gender':'male'}} }, { cid:76, date:"2016-08-25T00:00:00.000+0530", optkey:"key", optvalue:{value:{'name':'test','gender':'male'}} } ] }); 

 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div ng-app="myApp" ng-controller="myCtrl"> <div ng-repeat="item in list"> {{item.optvalue.value.name}} </div> </div> 

Answer 3

The response JSON is not valid :

1. Strings should be wrapped in double quotes.
2. Expecting colon, not = in key value pairs.
3. Invalid characters found.
4. Invalid number.

Issue Capture :

Valid JSON :

[
  {
    "cid": 74,
    "date": "2016-08-25T00:00:00.000+0530",
    "optkey": "key",
    "optvalue": {
      "value": {
        "name": "test",
        "gender": "male"
      }
    }
  },
  {
    "cid": 75,
    "date": "2016-08-25T00:00:00.000+0530",
    "optkey": "key",
    "optvalue": {
      "value": {
        "name": "test2",
        "gender": "female"
      }
    }
  },
  {
    "cid": 77,
    "date": "2016-08-26T00:00:00.000+0530",
    "optkey": "key",
    "optvalue": {
      "value": {
        "name": "test1",
        "gender": "female"
      }
    }
  }
]

In your case {{item.optvalue.value}} is giving undefined because optvalue is a string not an object.So, it should be an object .

"optvalue": {
          "value": {
            "name": "test1",
            "gender": "female"
          }
        }

Answer 4

thanks for your answers,i have resolved it using--

angular.toJson and angular.fromJson

while send to server used

angular.toJson(stringOfJson)

and when got the response object the using

angular.fromJson(value)

and set to object field,it is working fine.

Answer 5

you need to change your code to this

<div ng-repeat="item in list">
 {{item.optvalue.value.name}} 
</div>