.NET forums are moving to a new home on Microsoft Q&A, we encourage you to go to Microsoft Q&A for .NET for posting new questions and get involved today.
.NET forums are moving to a new home on Microsoft Q&A, we encourage you to go to Microsoft Q&A for .NET for posting new questions and get involved today.
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
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
Member
21 Points
75 Posts
Re: Grouping the Data in the Alphabetical order
Jan 19, 2017 06:49 AM|Aditya_ven|LINK
thank you