将 2 json 混合到 1 中。如何？（角JS）答案

【问题标题】：Mixing 2 json to in 1 . How ? ( AngularJS )将 2 json 混合到 1 中。如何？（角JS）
【发布时间】：2017-10-10 14:23:37
【问题描述】：

从后端获取2个json文件，需要混合！

第一次 ng 重复：

<p ng-repeat="category in categories track by category.id" >
  {{ category }}
</p>

结果

{"id":"Category-1"}
{"id":"Category-2"}
{"id":"Category-3"}

第二次重复：

<p ng-repeat="game in gamesList track by game.id">
  {{ game }}
</p>

结果

{"Category-id":"1","title":"Game-1"}
{"Category-id":"1","title":"Game-2"}
{"Category-id":"2","title":"Game-3"}
{"Category-id":"3","title":"Game-4"}
{"Category-id":"3","title":"Game-5"}

我需要混合这 2 个值并得到如下结果：

第 1 类

游戏一
第二场比赛

2 类

第三场比赛

第 3 类

第四场比赛
第五场比赛

【问题讨论】：

标签： javascript jquery angularjs json angularjs-ng-repeat

【解决方案1】：

你不必混合两个json，你可以只使用第二个json并使用GroupBy过滤器

演示

angular.module('datepickerBasicUsage', ['angular.filter'])
.controller('AppCtrl', function ($scope) {
   $scope.gamesList  = [{"Categoryid":"1","title":"Game-1"},
{"Categoryid":"1","title":"Game-2"},
{"Categoryid":"2","title":"Game-3"},
{"Categoryid":"3","title":"Game-4"},
{"Categoryid":"3","title":"Game-5"}];
});

<!doctype html>
<html ng-app="datepickerBasicUsage">
  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-filter/0.5.8/angular-filter.js"></script>
  </head>
  <body>

  <div ng-controller="AppCtrl" style='padding: 40px;'>
  <ul ng-repeat="(key, value) in gamesList | groupBy: 'Categoryid'">
  <h3> Category: {{ key }} </h3>
  <li ng-repeat="player in value">
     {{ player.title }} 
  </li>
</ul>
   </div>
  </body>
</html>

【讨论】：

感谢演示 :) 我已经下载了 angular.filter 并将其附加到项目中，但我在控制台中有此错误：“未知提供者：groupByFilterProvider
你需要注入angular-filter，查看demo