MSDN Community Support
Please remember to click "Mark as Answer" the responses that resolved your issue.
If you have any compliments or complaints to MSDN Support, feel free to contact MSDNFSF@microsoft.com.
MSDN Community Support
Please remember to click "Mark as Answer" the responses that resolved your issue.
If you have any compliments or complaints to MSDN Support, feel free to contact MSDNFSF@microsoft.com.
Member
21 Points
75 Posts
Grouping the Data in the Alphabetical order
Jan 03, 2017 10:15 PM|Aditya_ven|LINK
Hi Every one,
I have created an angular Application. And getting the data from controller.
when I user the ng-repeat and display all the data. I need to Group them with start letter of Name
When I apply filters orderBy:'Name' It’s sorting all the data and put in same placeholder.
Grouping Data in Alphabetical order and place them accordingly to their Start Letter
i.e
A
Data starts with A
B
Data starts with B
C
Data starts with C
D
Data starts with D
Any Help is Appreciated.
Thanks
Adi
All-Star
45489 Points
7008 Posts
Microsoft
Re: Grouping the Data in the Alphabetical order
Jan 04, 2017 02:10 AM|Zhi Lv - MSFT|LINK
Hi Aditya_ven,
As for this issue, you could refer to the following code:
var myApp = angular.module('myApp',[]); function MyCtrl($scope) { $scope.speakers = [ {name: 'Nick Whatevers'}, {name: 'Bob Not'}, {name: 'Anthony Poustrakis'}, {name: 'Bill Clit'} ]; $scope.firstLetter = function(name) { return name && name.charAt(0); } } <div ng-controller="MyCtrl"> <div ng-repeat="speaker in speakers | orderBy : 'name'"> <div class="item item-divider" ng-if="firstLetter(speaker.name) != firstLetter(speakers[$index-1].name)"> {{firstLetter(speaker.name)}} </div> {{speaker.name}} </div> </div>More details, see: http://jsfiddle.net/q85ot3td/
Also you could refer to this sample: https://jsfiddle.net/plantface/L6cQN/
Best regards,
Dillion
Please remember to click "Mark as Answer" the responses that resolved your issue.
If you have any compliments or complaints to MSDN Support, feel free to contact MSDNFSF@microsoft.com.
Member
21 Points
75 Posts
Re: Grouping the Data in the Alphabetical order
Jan 05, 2017 04:17 PM|Aditya_ven|LINK
Thank You Zhi.
It's working as expected
Member
21 Points
75 Posts
Re: Grouping the Data in the Alphabetical order
Jan 11, 2017 03:41 PM|Aditya_ven|LINK
Hi Zhi ,
It worked as expected but itd duplicating the data in few case:
myApp.controller("MyCtrl",function($scope){
$scope.speakers = [
{name: 'Nick Whatevers'},
{name: 'Anthony'},
{name: 'Bob Not'},
{name: 'Anthony Poustrakis'},
{name: 'bill Clit'},
{name: 'Johnny'},
{name: 'Jeeva'},
{name: 'Mother'},
{name: 'Martha'},
{name: 'Jai'}
];
Can You pls advise how can I remove the duplicates
All-Star
45489 Points
7008 Posts
Microsoft
Re: Grouping the Data in the Alphabetical order
Jan 13, 2017 06:58 AM|Zhi Lv - MSFT|LINK
Hi Aditya_ven,
As we can see, the data source is an object array, you could refer to the following code to loop through the array and remove the duplicates records:
<script type="text/javascript"> var Array = [{ "Name": "Bob Ross", "EmpID": "0441" }, { "Name": "Ram", "EmpID": "0442" }, { "name": "Bob Ross", "EmpID": "0441" }, { "name": "Pradeep", "text": "0443" }, { "name": "Ram", "text": "0442" }]; ArrayArray = Array.reduce(function (item, e1) { var matches = item.filter(function (e2) { return e1.EmpID == e2.EmpID}); if (matches.length == 0) { item.push(e1); } return item; }, []); console.log(Array); </script>More details, see:
http://www.c-sharpcorner.com/blogs/remove-duplicates-in-array-of-objects-using-jquery
Best regards,
Dillion
Please remember to click "Mark as Answer" the responses that resolved your issue.
If you have any compliments or complaints to MSDN Support, feel free to contact MSDNFSF@microsoft.com.
Member
21 Points
75 Posts
Re: Grouping the Data in the Alphabetical order
Jan 19, 2017 06:49 AM|Aditya_ven|LINK
thank you