组中的Ng重复| AngularJS

问题描述：

我有数据，这样的事情（它来自群，后端）：组中的Ng重复| AngularJS

$scope.games = [ 
    {"categories":["1"],"id":"id1"}, 
    {"categories":["1"],"id":"id2"}, 
    {"categories":["1"],"id":"id3"}, 
    {"categories":["1"],"id":"id4"}, 
    {"categories":["2"],"id":"id5"}, 
    {"categories":["2"],"id":"id6"}, 
    {"categories":["2"],"id":"id7"}, 
    {"categories":["3"],"id":"id8"}, 
    {"categories":["3"],"id":"id9"} 
    {"categories":["4"],"id":"id10"} 
];

所以，现在在没有任何类别分组的内容及其可见，像

id1 id2 id3 id4 id5 id6 id7 id8 id9 id10

但我需要这样做：

Category '1' 
id1 id2 id3 id4 

Category '2' 
id5 id6 id7 

Category '3' 
id8 id9 

Category '4' 
id10

HTML源代码：

<ul> 
    <li ng-repeat="game in games by game.id"> 
    ...    
    </li> 
</ul>

任何想法如何？在此先感谢！

你可以创建你自己的GROUPBY过滤器或使用https://github.com/a8m/angular-filter#groupby。我实际上只是用它来按日期分组一些项目 – Ronnie

看起来很棒。 –

答

为什么不让日期结构化？
对于（最简单的）例子：

$scope.games = { 
    "1": ["id1", "id2", "id3", "id4"], 
    "2": ["id5", "id6", "id7"] 
}

...等等。

我无法做到这一点，数据来自另一个国家的后端 –

要添加到这个，你可以预处理数据和ng - 重复预处理的数据 – Ronnie

答

试试这个。

<ul> 
    <li ng-repeat="(categories, catGames) in (games | groupBy: 
     'categories')"> 
    {{categories}} 
    <ul> 
     <li ng-repeat="game in catGames"> 
     {{game.id}} 
     </li> 
    </ul> 
    </li>

没有'groupBy'内置于有角的核心 – charlietfl

什么是catGames？ –

首先，我忘了提及你必须使用外部api [angular-filter]（https://github.com/a8m/angular-filter）。其次，在这个例子中，catGames是针对特定类别的游戏列表，并且针对每个类别创建了这样的列表。 –

组中的Ng重复| AngularJS

相关推荐