[Fixed]-Angular JS convert 2 dim JSON in django

by

1👍

✅

You can assign your data to a scope variable and repeat the items in table rows.

Heres an example of using the ngRepeat directive:

(function() {

  angular.module('MyApp', []);

})();

(function() {

  angular.module('MyApp').controller('MyController', MyController);

  MyController.$inject = ['$scope', '$http'];

  function MyController($scope, $http) {

    //$scope.getData = function() {
      //$http.get("/getcashflow/")
        //.success(function(data) {
          //$scope.response = data.data;
        //});
    //};

    //setInterval($scope.getData, 1000);

    // simulating data for illustrative purposes
    $scope.response = [{
      "model": "pricing.cashflow",
      "pk": 1,
      "fields": {
        "value": 4.0,
        "date": "2016-09-09"
      }
    }, {
      "model": "pricing.cashflow",
      "pk": 2,
      "fields": {
        "value": 3.0,
        "date": "2016-09-01"
      }
    }, {
      "model": "pricing.cashflow",
      "pk": 3,
      "fields": {
        "value": 3.0,
        "date": "2016-09-01"
      }
    }, {
      "model": "pricing.cashflow",
      "pk": 4,
      "fields": {
        "value": 3.0,
        "date": "2016-09-01"
      }
    }, {
      "model": "pricing.cashflow",
      "pk": 5,
      "fields": {
        "value": 3.0,
        "date": "2016-09-01"
      }
    }, {
      "model": "pricing.cashflow",
      "pk": 6,
      "fields": {
        "value": 5.0,
        "date": "2016-09-07"
      }
    }, {
      "model": "pricing.cashflow",
      "pk": 7,
      "fields": {
        "value": 3.0,
        "date": "2016-09-28"
      }
    }, {
      "model": "pricing.cashflow",
      "pk": 8,
      "fields": {
        "value": 3.0,
        "date": "2016-09-22"
      }
    }, {
      "model": "pricing.cashflow",
      "pk": 9,
      "fields": {
        "value": 5.0,
        "date": "2016-09-16"
      }
    }, {
      "model": "pricing.cashflow",
      "pk": 10,
      "fields": {
        "value": 5.0,
        "date": "2016-09-16"
      }
    }];
  }

})();
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div data-ng-app="MyApp">

  <div data-ng-controller="MyController">

    <table>

      <thead>
        <th>PK
          <th>
            <th>Value</th>
            <th>Date</th>
      </thead>

      <tbody>
        <tr data-ng-repeat="data in response">
          <td>{{data.pk}}</td>
          <td>{{data.fields.value}}</td>
          <td>{{data.fields.date}}</td>
        </tr>
      </tbody>

    </table>

  </div>

</div>
👤cnorthfield

Leave a comment