Advance tutorial Angular sorting data sorting of id, age, name ascending descending order angular 9

[Music] so welcome to my youtube channel it is codetech and in this video i am going to show you that how to do a sorting in angular sorting by id sorting by age and sorting by name so we need we will see that so first of all i've made the already already made the function for sorting the ids and this is my sort function which is which is inbuilt javascript function which we can use for sorting the data so this is my show data so why i'm using the show data because all of my show data array is coming inside the show data that's why i'm using the show data i've called an api and inside that api i get the response of that api and show data so let's begin with that and we need to call that function on the click of id so that id is going to get sorted so let's paste it that function click and sort data let's go to the browser and let's see that whether we are getting a sorting whether we are able to do a sorting or not on this data so let's click on that so we are able to do the sorting but on the click of employees we are getting that sorting which is i think i have called the wrong function on click of employee edge we are sorting the id so we have to fix that so just cut that thing and we need to paste inside that id so on the click of that id so our id is going to get sorted means increasing decreasing order we will get so let's see this we get the sorting ids in the increasing and decreasing order so uh now we need to do that sorting the employee edge in the same way so i'm going to make a function for sorting the age so let sort edge and we need to call the same thing do the same thing nothing is different from that order this dot order sorry i'm just copying that thing let me order this show data show data this will be a show data and this will be a short date show data do show show data now let's copy that paste that function [Music] let's write that let new array here [Music] [Music] b so we're all sorting going we get curve inside a and b now we need to iterate that particular variable of that api response so we need to look inside that this will be employee age so we have no i'm just copying that employee age and for sorting the age we need to just a dot need to do a dot employee age so in this way our age of that data is going to get sorted and we will get the increasing days in order and b dot employee.h okay now before now let new er and this dot show data dot sort now this time b dot employee h minus a dot employee h for decreasing order b dot employee age minus a dot employee age does not show data new arr and this dot order is equal to not this dot order okay now whatever the condition we are getting inside if this dot order so it will just come that in that manner this dot order is not equal to this dot order okay let's save it and we'll have to look on our browser let me check it out and just i'm saving the let's check it short edge and everything is fine now let's come to write a function that on that call of the function our age is going to get sorted so click and call that function of the sort edge and in this way our age is going to get sorted so let's check it out our id is going to get sort now age age is also begins getting sorted 1921. let's see this is increasing and this is a decreasing order so this thing is going to get sorted now we need to sort the name because name is also because i'm going to get sorted so i i'm writing the function short name and this will be going to get done in a different way this dot is i have taken just variable i have declared this variable in the export inside of our classes and if this is this is not equal to this dot descript so ah let now we need to take one variable direction i have taken one variable direction and inside the direction we need to call our this dot show is this encryption this will go into the ternary operator one and one minus minus one the direction would be a one or minus one so it will call automatically our a minus v that that we have done in the upper function so we need to just call that variable inside our which in which our responses we are getting the response inside it and this is the showdata.sort function [Music] a comma b f property you know a of square bracket property property we need to pass the parameters inside inside the sorting function that's why we are getting error let's wait it out let me write that b of property let's paste that property inside sort name and let [Music] all right done we need to return that value we need to return that whether it's going with increasing or decreasing order so return minus 1 into direction so in side direction we are having the a and inside if a property means if our if the data is uh in a decrease in a uh decreasing order so this will going to get call and return in the increasing order and as our data if is already in a increasing order so it will call a decreasing so else if a property is greater than b of property return one into direction we need to just simply call that direction one in two directions else return zero so let's see that what we are getting in the property we need to call that sort name variable you know inside our name is exist so this will be for sorting our name and these are the function let's comment that html side and i think i have already been done for employee a short name this will be the function on the click of that short name and employee name this will be the variable inside our inside which our name is exist so like this employee name and then the click of that name our name is going to get sorted now let's check it out on browser let's save this and save on da site also control s now let's check it it on on browser and our id sorted age is going to get sorted and now we need to check it out our name name is also going to get sorted let's see let's see this we are getting in the decreasing order now so let's finish this video that's that's all about in this video and thank you for watching and if you like this video please do like subscribe my channel and please do like my video thank you and please share it thank you

Channel: Code Tech

Views: 23,355

Keywords:

Id: T3mBj_dz_PU

Length: 13min 1sec (781 seconds)

Published: Mon Dec 07 2020