I have a array of object. I need to group the data by one field and show the result in an HTML table.
INPUT :
[
{
id: "559e2bbc9a496034557d6d84",
text: "Data Sources",
topParentId: "559e2bbc9a496034557d6d84",
topParentText: "Data Sources"
},
{
id: "559e2bbc9a496034557d6d83",
text: "Applications",
topParentId: "559e2bbc9a496034557d6d83",
topParentText: "Applications"
},
{
id: "559e2bbc9a496034557d6d82",
text: "Analytics",
topParentId: "559e2bbc9a496034557d6d83",
topParentText: "Applications"
}
]
From this I need to create an HTML table like this (grouping data by topParentId):
Group | Tags
Data Sources | Data Sources
Applications | Applications Analytics
So far I have done this:
<table class="table table-bordered">
<thead>
<tr>
<th>Group</th>
<th>Tags</th>
</tr >
</thead>
<tbody>
<tr ng-repeat="tag in topic.tags | groupBy: 'topParentId'">
<td>{{tag.topParentText}}</td>
</tr>
<tr>
<td>{{tag.text}}</td>
</tr>
</tbody>
</table>
But after running this code, I am getting Unknown provider: groupByFilterProvider <- groupByFilter
error.
I am using AngularJs 1.2
As mentionned by @jhadesdev
orderBy
is available out of the box, but notgroupBy
. It is included in angular-filter