JSON key contains spaces

Question

I have following json and need to display its name in the table as "PAY ALL", "PAY PART", "DECLINE", but the key contains the spaces in it also its corresponding value for pay all, pay part need to be displayed in corresponding table row data. How can I achieve it. My json object is as follow-

$scope.tableData={

        "KEY-1": "VALUE-1",

        "KEY-2": "VALUE-2",

        "data": {

            "PAY ALL": {

                    "NumberOfBills": "1800000",

                    "CummalativeBillAmount": "45000000",

                    "ResponseProgress": "60"

                },
                "PAY PART": {

                    "NumberOfBills": "6000000",

                    "CummalativeBillAmount": "15000000",

                    "ResponseProgress": "20"

                },
                "DECLINE": {

                    "NumberOfBills": "3000000",

                    "CummalativeBillAmount": "7500000",

                    "ResponseProgress": "10"

                },
                "REQUEST EXTENSION": {

                    "NumberOfBills": "240000",

                    "CummalativeBillAmount": "6000000",

                    "ResponseProgress": "8"

                }

    }

}

Also I need to achieve following table as from the above json response -

I tried the following in my html binding, but it does not show up anything.

<tr ng-repeat="dataValue in tableData">
            <td><img src="./assets/images/Group 384@2x.png" class="img-bo"/></td>
            <td>{{dataValue.data["PAY ALL"]}}</td>
            <td><div class="bg">{{dataValue.data.NumberOfBills}}</div></td>
            <td><div class="bg">{{dataValue.data.CummalativeBillAmount}}</div></td>
            <td><div class="bg">{{dataValue.data.ResponseProgress}}</div></td>
          </tr>

Please help.

*"My json object is as follow..."* That's not JSON. JSON is a *textual notation* for data exchange. [(More here.)](http://stackoverflow.com/a/2904181/157247) If you're dealing with JavaScript source code, and not dealing with a *string*, you're not dealing with JSON. — T.J. Crowder, Oct 17 '17 at 07:21
https://stackoverflow.com/questions/35541239/how-can-i-remove-white-spaces-between-keys-and-values-of-object — Dipak, Oct 17 '17 at 07:23
https://stackoverflow.com/questions/44204765/remove-spaces-in-json-keys — Dipak, Oct 17 '17 at 07:24

jitender · Answer 1 · 2017-10-17T07:37:45.500

Your code should be something like

 <table>
  <tr>
    <th>category </th>
     <th>no of bills</th>
     <th>commulative amount</th>
     <th>response</th>
  </tr>
  <tr ng-repeat="(key,value) in tableData.data">
        <td>{{key}}</td>
            <td><div class="bg">{{value.NumberOfBills}}</div></td>
            <td><div class="bg">{{value.CummalativeBillAmount}}</div></td>
            <td><div class="bg">{{value.ResponseProgress}}</div></td>
          </tr>
  </table>

Here is working fiddle

JSON key contains spaces

1 Answers1