ng-повторно передать данные строки в столбец angularjs

Question

$scope.value = {"id":"1", "future_date1" : "0000-00-00", "future_date2" : "0000-00-00","future_date3" : "2018-10-10","future_date4" : "2018-11-11","future_date5" : "2018-12-12", "fut_amt1" : "", "fut_amt2" : "0", "fut_amt3" : "16", "fut_amt4" : "20","fut_amt5" : "15"}

Это должно быть в таблице

Как мы можем решить с помощью ng-repeat или как это возможно простым способом angularjs

Date        Amt
2018-10-10  16
2018-11-11  20
2018-12-12  15

Answer 1

Вы можете использовать следующее для перебора вашего объекта и отображения значений Date и Amt.

JS:

$scope.value = {"id":"1", "future_date1" : "0000-00-00", "future_date2" : "0000-00-00","future_date3" : "2018-10-10","future_date4" : "2018-11-11","future_date5" : "2018-12-12", "fut_amt1" : "", "fut_amt2" : "0", "fut_amt3" : "16", "fut_amt4" : "20","fut_amt5" : "15"}

$scope.length = Math.floor(Object.keys($scope.value).length / 2);

$scope.getLength = function(){
    return new Array($scope.length);
}

$scope.getValueByIndex = function(index){
    var key = Object.keys($scope.value)[index];
    value = $scope.value[key];
    return value;
}

html:

<table>
    <tr>
        <td>
          Date
        </td>
        <td>
          Amt
        </td>
    </tr>
    <tr ng-repeat="item in getLength() track by $index" ng-if="getValueByIndex($index + 1 + length) > 0">
        <td>
          {{getValueByIndex($index + 1)}}
        </td>
        <td>
          {{getValueByIndex($index + 1 + length)}}
        </td>
    </tr>
</table>

Демо

Answer 2

Вам нужно сначала преобразовать ваш объект в массив в вашем контроллере, а затем просто использовать ng-repeat для этого.Попробуйте следующее.

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

app.controller('MainCtrl', function($scope) {
  $scope.value = {"id":"1", "future_date1" : "0000-00-00", "future_date2" : "0000-00-00","future_date3" : "2018-10-10","future_date4" : "2018-11-11","future_date5" : "2018-12-12", "fut_amt1" : "", "fut_amt2" : "0", "fut_amt3" : "16", "fut_amt4" : "20","fut_amt5" : "15"};
  $scope.updatedValue = [];
  for (var i = 1; i <= (Object.keys($scope.value).length-1)/2; i++) {
    if($scope.value["future_date"+i] !== '0000-00-00') 
    $scope.updatedValue.push({
      "date" : $scope.value["future_date"+i],
      "amt" : $scope.value["fut_amt"+i]
    });
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp">
  <div ng-controller="MainCtrl">
    <table>
      <tr><td>Date</td><td>Amt</td></tr>
      <tr ng-repeat="val in updatedValue"><td>{{val.date}}</td><td>{{val.amt}}</td></tr>
    </table>
  </div>
</div>