Angularjs:如果重复,如何仅从对象打印一次数据

时间:2017-01-20 17:32:26

标签: angularjs json

我的目标是使用ng-repeat打印对象,但知道某些键会重复出现。我希望它只在这种情况下打印一次并且我想计算其相似值的平均值。

这是我的数据。

[  
   {  
      "0":"1",
      "1":"Creativity",
      "2":"5",
      "3":"1",
      "4":"2017-01-17 21:24:42",
      "5":"ratings",
      "6":null,
      "ID":"1",
      "Title":"Creativity",
      "Value":"5",
      "Parent":"1",
      "Timestamp":"2017-01-17 21:24:42",
      "Category":"ratings",
      "Author":null
   },
   {  
      "0":"2",
      "1":"Courage",
      "2":"4",
      "3":"1",
      "4":"2017-01-17 21:24:42",
      "5":"ratings",
      "6":null,
      "ID":"2",
      "Title":"Courage",
      "Value":"4",
      "Parent":"1",
      "Timestamp":"2017-01-17 21:24:42",
      "Category":"ratings",
      "Author":null
   },
   {  
      "0":"3",
      "1":"Honnesty",
      "2":"4",
      "3":"1",
      "4":"2017-01-17 21:24:42",
      "5":"ratings",
      "6":null,
      "ID":"3",
      "Title":"Honnesty",
      "Value":"4",
      "Parent":"1",
      "Timestamp":"2017-01-17 21:24:42",
      "Category":"ratings",
      "Author":null
   },
   {  
      "0":"4",
      "1":"Ambition",
      "2":"3",
      "3":"1",
      "4":"2017-01-17 21:24:42",
      "5":"ratings",
      "6":null,
      "ID":"4",
      "Title":"Ambition",
      "Value":"3",
      "Parent":"1",
      "Timestamp":"2017-01-17 21:24:42",
      "Category":"ratings",
      "Author":null
   },
   {  
      "0":"5",
      "1":"Integrity",
      "2":"4",
      "3":"1",
      "4":"2017-01-17 21:24:42",
      "5":"ratings",
      "6":null,
      "ID":"5",
      "Title":"Integrity",
      "Value":"4",
      "Parent":"1",
      "Timestamp":"2017-01-17 21:24:42",
      "Category":"ratings",
      "Author":null
   },
   {  
      "0":"165",
      "1":"Creativity",
      "2":"4",
      "3":"1",
      "4":"2017-01-20 21:12:25",
      "5":"ratings",
      "6":"18",
      "ID":"165",
      "Title":"Creativity",
      "Value":"4",
      "Parent":"1",
      "Timestamp":"2017-01-20 21:12:25",
      "Category":"ratings",
      "Author":"18"
   },
   {  
      "0":"166",
      "1":"Courage",
      "2":"4",
      "3":"1",
      "4":"2017-01-20 21:12:25",
      "5":"ratings",
      "6":"18",
      "ID":"166",
      "Title":"Courage",
      "Value":"4",
      "Parent":"1",
      "Timestamp":"2017-01-20 21:12:25",
      "Category":"ratings",
      "Author":"18"
   },
   {  
      "0":"167",
      "1":"Honnesty",
      "2":"2",
      "3":"1",
      "4":"2017-01-20 21:12:25",
      "5":"ratings",
      "6":"18",
      "ID":"167",
      "Title":"Honnesty",
      "Value":"2",
      "Parent":"1",
      "Timestamp":"2017-01-20 21:12:25",
      "Category":"ratings",
      "Author":"18"
   },
   {  
      "0":"168",
      "1":"Ambition",
      "2":"3",
      "3":"1",
      "4":"2017-01-20 21:12:25",
      "5":"ratings",
      "6":"18",
      "ID":"168",
      "Title":"Ambition",
      "Value":"3",
      "Parent":"1",
      "Timestamp":"2017-01-20 21:12:25",
      "Category":"ratings",
      "Author":"18"
   },
   {  
      "0":"169",
      "1":"Integrity",
      "2":"2",
      "3":"1",
      "4":"2017-01-20 21:12:25",
      "5":"ratings",
      "6":"18",
      "ID":"169",
      "Title":"Integrity",
      "Value":"2",
      "Parent":"1",
      "Timestamp":"2017-01-20 21:12:25",
      "Category":"ratings",
      "Author":"18"
   },
   {  
      "0":"170",
      "1":"Creativity",
      "2":"4",
      "3":"1",
      "4":"2017-01-20 21:16:53",
      "5":"ratings",
      "6":"18",
      "ID":"170",
      "Title":"Creativity",
      "Value":"4",
      "Parent":"1",
      "Timestamp":"2017-01-20 21:16:53",
      "Category":"ratings",
      "Author":"18"
   },
   {  
      "0":"171",
      "1":"Courage",
      "2":"4",
      "3":"1",
      "4":"2017-01-20 21:16:53",
      "5":"ratings",
      "6":"18",
      "ID":"171",
      "Title":"Courage",
      "Value":"4",
      "Parent":"1",
      "Timestamp":"2017-01-20 21:16:53",
      "Category":"ratings",
      "Author":"18"
   },
   {  
      "0":"172",
      "1":"Honnesty",
      "2":"5",
      "3":"1",
      "4":"2017-01-20 21:16:53",
      "5":"ratings",
      "6":"18",
      "ID":"172",
      "Title":"Honnesty",
      "Value":"5",
      "Parent":"1",
      "Timestamp":"2017-01-20 21:16:53",
      "Category":"ratings",
      "Author":"18"
   },
   {  
      "0":"173",
      "1":"Ambition",
      "2":"3",
      "3":"1",
      "4":"2017-01-20 21:16:53",
      "5":"ratings",
      "6":"18",
      "ID":"173",
      "Title":"Ambition",
      "Value":"3",
      "Parent":"1",
      "Timestamp":"2017-01-20 21:16:53",
      "Category":"ratings",
      "Author":"18"
   },
   {  
      "0":"174",
      "1":"Integrity",
      "2":"5",
      "3":"1",
      "4":"2017-01-20 21:16:53",
      "5":"ratings",
      "6":"18",
      "ID":"174",
      "Title":"Integrity",
      "Value":"5",
      "Parent":"1",
      "Timestamp":"2017-01-20 21:16:53",
      "Category":"ratings",
      "Author":"18"
   }
]

这是我的HTML

<h3>Overall Ratings: {{ getTotal() }}</h3>
        <div class="row">
            <div class="container">
                <table class="table table-hover">
                    <thead>
                        <tr>
                            <th>Label</th>
                            <th>Rate</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr ng-repeat="profile in data | filter:searchFilter">
                            <td>{{profile.Title}}</td>
                            <td>{{profile.Value}}</td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>

问题是输出是这样的:

enter image description here

输出应该是这样的:

 [{
                "Value": 4.25,
                "Title": "Creativity",
            },
            {
                "Value": 2.7,
                "Title": "Courage",
            },
            {
                "Value": 3.33,
                "Title": "Honnesty",
            }, {
                "Value": 4.5,
                "Title": "Ambition",
            }, {
                "Value": 5,
                "Title": "Integrity",
            }
        ];

4 个答案:

答案 0 :(得分:2)

我的ES6解决方案:)

编辑:有点整理。

const data = [{
  "0": "1",
  "1": "Creativity",
  "2": "5",
  "3": "1",
  "4": "2017-01-17 21:24:42",
  "5": "ratings",
  "6": null,
  "ID": "1",
  "Title": "Creativity",
  "Value": "5",
  "Parent": "1",
  "Timestamp": "2017-01-17 21:24:42",
  "Category": "ratings",
  "Author": null
}, {
  "0": "2",
  "1": "Courage",
  "2": "4",
  "3": "1",
  "4": "2017-01-17 21:24:42",
  "5": "ratings",
  "6": null,
  "ID": "2",
  "Title": "Courage",
  "Value": "4",
  "Parent": "1",
  "Timestamp": "2017-01-17 21:24:42",
  "Category": "ratings",
  "Author": null
}, {
  "0": "3",
  "1": "Honnesty",
  "2": "4",
  "3": "1",
  "4": "2017-01-17 21:24:42",
  "5": "ratings",
  "6": null,
  "ID": "3",
  "Title": "Honnesty",
  "Value": "4",
  "Parent": "1",
  "Timestamp": "2017-01-17 21:24:42",
  "Category": "ratings",
  "Author": null
}, {
  "0": "4",
  "1": "Ambition",
  "2": "3",
  "3": "1",
  "4": "2017-01-17 21:24:42",
  "5": "ratings",
  "6": null,
  "ID": "4",
  "Title": "Ambition",
  "Value": "3",
  "Parent": "1",
  "Timestamp": "2017-01-17 21:24:42",
  "Category": "ratings",
  "Author": null
}, {
  "0": "5",
  "1": "Integrity",
  "2": "4",
  "3": "1",
  "4": "2017-01-17 21:24:42",
  "5": "ratings",
  "6": null,
  "ID": "5",
  "Title": "Integrity",
  "Value": "4",
  "Parent": "1",
  "Timestamp": "2017-01-17 21:24:42",
  "Category": "ratings",
  "Author": null
}, {
  "0": "165",
  "1": "Creativity",
  "2": "4",
  "3": "1",
  "4": "2017-01-20 21:12:25",
  "5": "ratings",
  "6": "18",
  "ID": "165",
  "Title": "Creativity",
  "Value": "4",
  "Parent": "1",
  "Timestamp": "2017-01-20 21:12:25",
  "Category": "ratings",
  "Author": "18"
}, {
  "0": "166",
  "1": "Courage",
  "2": "4",
  "3": "1",
  "4": "2017-01-20 21:12:25",
  "5": "ratings",
  "6": "18",
  "ID": "166",
  "Title": "Courage",
  "Value": "4",
  "Parent": "1",
  "Timestamp": "2017-01-20 21:12:25",
  "Category": "ratings",
  "Author": "18"
}, {
  "0": "167",
  "1": "Honnesty",
  "2": "2",
  "3": "1",
  "4": "2017-01-20 21:12:25",
  "5": "ratings",
  "6": "18",
  "ID": "167",
  "Title": "Honnesty",
  "Value": "2",
  "Parent": "1",
  "Timestamp": "2017-01-20 21:12:25",
  "Category": "ratings",
  "Author": "18"
}, {
  "0": "168",
  "1": "Ambition",
  "2": "3",
  "3": "1",
  "4": "2017-01-20 21:12:25",
  "5": "ratings",
  "6": "18",
  "ID": "168",
  "Title": "Ambition",
  "Value": "3",
  "Parent": "1",
  "Timestamp": "2017-01-20 21:12:25",
  "Category": "ratings",
  "Author": "18"
}, {
  "0": "169",
  "1": "Integrity",
  "2": "2",
  "3": "1",
  "4": "2017-01-20 21:12:25",
  "5": "ratings",
  "6": "18",
  "ID": "169",
  "Title": "Integrity",
  "Value": "2",
  "Parent": "1",
  "Timestamp": "2017-01-20 21:12:25",
  "Category": "ratings",
  "Author": "18"
}, {
  "0": "170",
  "1": "Creativity",
  "2": "4",
  "3": "1",
  "4": "2017-01-20 21:16:53",
  "5": "ratings",
  "6": "18",
  "ID": "170",
  "Title": "Creativity",
  "Value": "4",
  "Parent": "1",
  "Timestamp": "2017-01-20 21:16:53",
  "Category": "ratings",
  "Author": "18"
}, {
  "0": "171",
  "1": "Courage",
  "2": "4",
  "3": "1",
  "4": "2017-01-20 21:16:53",
  "5": "ratings",
  "6": "18",
  "ID": "171",
  "Title": "Courage",
  "Value": "4",
  "Parent": "1",
  "Timestamp": "2017-01-20 21:16:53",
  "Category": "ratings",
  "Author": "18"
}, {
  "0": "172",
  "1": "Honnesty",
  "2": "5",
  "3": "1",
  "4": "2017-01-20 21:16:53",
  "5": "ratings",
  "6": "18",
  "ID": "172",
  "Title": "Honnesty",
  "Value": "5",
  "Parent": "1",
  "Timestamp": "2017-01-20 21:16:53",
  "Category": "ratings",
  "Author": "18"
}, {
  "0": "173",
  "1": "Ambition",
  "2": "3",
  "3": "1",
  "4": "2017-01-20 21:16:53",
  "5": "ratings",
  "6": "18",
  "ID": "173",
  "Title": "Ambition",
  "Value": "3",
  "Parent": "1",
  "Timestamp": "2017-01-20 21:16:53",
  "Category": "ratings",
  "Author": "18"
}, {
  "0": "174",
  "1": "Integrity",
  "2": "5",
  "3": "1",
  "4": "2017-01-20 21:16:53",
  "5": "ratings",
  "6": "18",
  "ID": "174",
  "Title": "Integrity",
  "Value": "5",
  "Parent": "1",
  "Timestamp": "2017-01-20 21:16:53",
  "Category": "ratings",
  "Author": "18"
}]

const modifiedData = Object.values(
  [...new Set(data.map(({Title}) => Title))]
  .reduce((a, v, i) => ({
    ...a, [i]: {
      "Title": v,
      "Value": data
        .filter(({Title}) => Title === v)
        .map(({Value}) => +Value)
        .reduce((a, v, i, {length}) => {
          const sum = a + v;
          return (i === length - 1) ? sum / length : sum
        })
    }
  }), {})
)

console.log(modifiedData);

答案 1 :(得分:2)

您可以尝试使用角度滤镜(https://github.com/a8m/angular-filter

以下是摘录:

&#13;
&#13;
var app = angular.module("myApp", ['angular.filter']);
app.controller("myCtrl", function($scope) {
    $scope.getAvg = function(values) {
      var sum = 0;
      for (var i=0;i<values.length;i++) {
        sum += parseInt(values[i].Value)
      }
      
      return sum/values.length
    };
  
    $scope.data = [  
       {  
          "0":"1",
          "1":"Creativity",
          "2":"5",
          "3":"1",
          "4":"2017-01-17 21:24:42",
          "5":"ratings",
          "6":null,
          "ID":"1",
          "Title":"Creativity",
          "Value":"5",
          "Parent":"1",
          "Timestamp":"2017-01-17 21:24:42",
          "Category":"ratings",
          "Author":null
       },
       {  
          "0":"2",
          "1":"Courage",
          "2":"4",
          "3":"1",
          "4":"2017-01-17 21:24:42",
          "5":"ratings",
          "6":null,
          "ID":"2",
          "Title":"Courage",
          "Value":"4",
          "Parent":"1",
          "Timestamp":"2017-01-17 21:24:42",
          "Category":"ratings",
          "Author":null
       },
       {  
          "0":"3",
          "1":"Honnesty",
          "2":"4",
          "3":"1",
          "4":"2017-01-17 21:24:42",
          "5":"ratings",
          "6":null,
          "ID":"3",
          "Title":"Honnesty",
          "Value":"4",
          "Parent":"1",
          "Timestamp":"2017-01-17 21:24:42",
          "Category":"ratings",
          "Author":null
       },
       {  
          "0":"4",
          "1":"Ambition",
          "2":"3",
          "3":"1",
          "4":"2017-01-17 21:24:42",
          "5":"ratings",
          "6":null,
          "ID":"4",
          "Title":"Ambition",
          "Value":"3",
          "Parent":"1",
          "Timestamp":"2017-01-17 21:24:42",
          "Category":"ratings",
          "Author":null
       },
       {  
          "0":"5",
          "1":"Integrity",
          "2":"4",
          "3":"1",
          "4":"2017-01-17 21:24:42",
          "5":"ratings",
          "6":null,
          "ID":"5",
          "Title":"Integrity",
          "Value":"4",
          "Parent":"1",
          "Timestamp":"2017-01-17 21:24:42",
          "Category":"ratings",
          "Author":null
       },
       {  
          "0":"165",
          "1":"Creativity",
          "2":"4",
          "3":"1",
          "4":"2017-01-20 21:12:25",
          "5":"ratings",
          "6":"18",
          "ID":"165",
          "Title":"Creativity",
          "Value":"4",
          "Parent":"1",
          "Timestamp":"2017-01-20 21:12:25",
          "Category":"ratings",
          "Author":"18"
       },
       {  
          "0":"166",
          "1":"Courage",
          "2":"4",
          "3":"1",
          "4":"2017-01-20 21:12:25",
          "5":"ratings",
          "6":"18",
          "ID":"166",
          "Title":"Courage",
          "Value":"4",
          "Parent":"1",
          "Timestamp":"2017-01-20 21:12:25",
          "Category":"ratings",
          "Author":"18"
       },
       {  
          "0":"167",
          "1":"Honnesty",
          "2":"2",
          "3":"1",
          "4":"2017-01-20 21:12:25",
          "5":"ratings",
          "6":"18",
          "ID":"167",
          "Title":"Honnesty",
          "Value":"2",
          "Parent":"1",
          "Timestamp":"2017-01-20 21:12:25",
          "Category":"ratings",
          "Author":"18"
       },
       {  
          "0":"168",
          "1":"Ambition",
          "2":"3",
          "3":"1",
          "4":"2017-01-20 21:12:25",
          "5":"ratings",
          "6":"18",
          "ID":"168",
          "Title":"Ambition",
          "Value":"3",
          "Parent":"1",
          "Timestamp":"2017-01-20 21:12:25",
          "Category":"ratings",
          "Author":"18"
       },
       {  
          "0":"169",
          "1":"Integrity",
          "2":"2",
          "3":"1",
          "4":"2017-01-20 21:12:25",
          "5":"ratings",
          "6":"18",
          "ID":"169",
          "Title":"Integrity",
          "Value":"2",
          "Parent":"1",
          "Timestamp":"2017-01-20 21:12:25",
          "Category":"ratings",
          "Author":"18"
       },
       {  
          "0":"170",
          "1":"Creativity",
          "2":"4",
          "3":"1",
          "4":"2017-01-20 21:16:53",
          "5":"ratings",
          "6":"18",
          "ID":"170",
          "Title":"Creativity",
          "Value":"4",
          "Parent":"1",
          "Timestamp":"2017-01-20 21:16:53",
          "Category":"ratings",
          "Author":"18"
       },
       {  
          "0":"171",
          "1":"Courage",
          "2":"4",
          "3":"1",
          "4":"2017-01-20 21:16:53",
          "5":"ratings",
          "6":"18",
          "ID":"171",
          "Title":"Courage",
          "Value":"4",
          "Parent":"1",
          "Timestamp":"2017-01-20 21:16:53",
          "Category":"ratings",
          "Author":"18"
       },
       {  
          "0":"172",
          "1":"Honnesty",
          "2":"5",
          "3":"1",
          "4":"2017-01-20 21:16:53",
          "5":"ratings",
          "6":"18",
          "ID":"172",
          "Title":"Honnesty",
          "Value":"5",
          "Parent":"1",
          "Timestamp":"2017-01-20 21:16:53",
          "Category":"ratings",
          "Author":"18"
       },
       {  
          "0":"173",
          "1":"Ambition",
          "2":"3",
          "3":"1",
          "4":"2017-01-20 21:16:53",
          "5":"ratings",
          "6":"18",
          "ID":"173",
          "Title":"Ambition",
          "Value":"3",
          "Parent":"1",
          "Timestamp":"2017-01-20 21:16:53",
          "Category":"ratings",
          "Author":"18"
       },
       {  
          "0":"174",
          "1":"Integrity",
          "2":"5",
          "3":"1",
          "4":"2017-01-20 21:16:53",
          "5":"ratings",
          "6":"18",
          "ID":"174",
          "Title":"Integrity",
          "Value":"5",
          "Parent":"1",
          "Timestamp":"2017-01-20 21:16:53",
          "Category":"ratings",
          "Author":"18"
       }
    ];
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/angular-filter/0.4.7/angular-filter.js"></script>

<div ng-app="myApp" ng-controller="myCtrl">
    <table ng-repeat="(key, value) in data | groupBy: 'Title'">
      <tr>
        <td>{{key}}</td>
        <td>{{getAvg(value)}}
      </tr>
    </table>
  </div>
&#13;
&#13;
&#13;

答案 2 :(得分:0)

您可以遍历原始数据<script src="https://cdn.jsdelivr.net/lodash/4.17.4/lodash.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div class="row" ng-app="app" ng-controller="myCtrl"> <div class="container"> <table class="table table-hover"> <thead> <tr> <th>Label</th> <th>Rate</th> </tr> </thead> <tbody> <tr ng-repeat="profile in modifiedData | filter:searchFilter"> <td>{{profile.Title}}</td> <td>{{profile.Value}}</td> </tr> </tbody> </table> </div> </div>并重复它们,如下所示。我已经使用lodash来简化数组和对象的使用。

&#13;
&#13;
{{1}}
&#13;
{{1}}
&#13;
&#13;
&#13;

答案 3 :(得分:0)

您可以创建一个简单的service,它在将数据渲染到DOM之前实际过滤数据。请参阅plunker

app.service('calcAverage', function () {
    return function (input) {
        output = {
            titles: [],
            values: [],
            repeated:[]
        };
        var tempIndex = 0;
        angular.forEach(input, function (val, key) {
            tempIndex = output.titles.indexOf(val.Title);
            if (tempIndex === -1) {
                output.titles.push(val.Title);
                output.values.push(val.Value);
                output.repeated.push(1);
            } else {
                output.repeated[tempIndex] += 1
                output.values[tempIndex] = ((parseInt(output.values[tempIndex]) + parseInt(val.Value)));
            }
        })

        return output.titles.map(function (val, index) {

            return {
                Title: val,
                Value: (output.values[index] / output.repeated[tempIndex]).toFixed(2)
            }
        })


    }
});

然后在你的控制器中:

$scope.data = calcAverage($scope.data);