I am getting an array of "product"s from a resolver
getting data from a json
endpoint.
ngOnInit() {
this.products = this._route.snapshot.data.products;
console.log('products: ',
this.products);
}
where
one of the objects in this array is in the
format
{
"id": 3645,
"date": "2018-07-05T13:13:37",
"date_gmt":
"2018-07-05T13:13:37",
"guid": {
"rendered": ""
},
"modified": "2018-07-05T13:13:37",
"modified_gmt":
"2018-07-05T13:13:37",
"slug": "vpwin",
"status":
"publish",
"type": "matrix",
"link": "",
"title":
{
"rendered": "VPWIN"
},
"content": {
"rendered": "",
"protected": false
},
"featured_media": 0,
"parent": 0,
"template": "",
"better_featured_image": null,
"acf": {
"domain":
"SMB",
"ds_rating": "3",
"dt_rating": ""
},
...
},
What
I want to do is sort this array by the field
title.rendered
In olden
times, in AngularJS, I would simply use an orderBy
pipe in the
template set to this field. Apparently, this is removed in Angular and from doing
research it seems the preferred method is to sort the data itself, such as in
ngOnInit
.
But I can't
figure out how to sort products
by
producs.title.rendered
.
Answer
You can simply use
Arrays.sort()
array.sort((a,b)
=>
a.title.rendered.localeCompare(b.title.rendered));
Working
Example :
class="snippet-code">
var array =
[{"id":3645,"date":"2018-07-05T13:13:37","date_gmt":"2018-07-05T13:13:37","guid":{"rendered":""},"modified":"2018-07-05T13:13:37","modified_gmt":"2018-07-05T13:13:37","slug":"vpwin","status":"publish","type":"matrix","link":"","title":{"rendered":"VPWIN"},"content":{"rendered":"","protected":false},"featured_media":0,"parent":0,"template":"","better_featured_image":null,"acf":{"domain":"SMB","ds_rating":"3","dt_rating":""},},{"id":3645,"date":"2018-07-05T13:13:37","date_gmt":"2018-07-05T13:13:37","guid":{"rendered":""},"modified":"2018-07-05T13:13:37","modified_gmt":"2018-07-05T13:13:37","slug":"vpwin","status":"publish","type":"matrix","link":"","title":{"rendered":"adfPWIN"},"content":{"rendered":"","protected":false},"featured_media":0,"parent":0,"template":"","better_featured_image":null,"acf":{"domain":"SMB","ds_rating":"3","dt_rating":""}},{"id":3645,"date":"2018-07-05T13:13:37","date_gmt":"2018-07-05T13:13:37","guid":{"rendered":""},"modified":"2018-07-05T13:13:37","modified_gmt":"2018-07-05T13:13:37","slug":"vpwin","status":"publish","type":"matrix","link":"","title":{"rendered":"bbfPWIN"},"content":{"rendered":"","protected":false},"featured_media":0,"parent":0,"template":"","better_featured_image":null,"acf":{"domain":"SMB","ds_rating":"3","dt_rating":""}}];
array.sort((a,b)
=> a.title.rendered.localeCompare(b.title.rendered));
console.log(array);
No comments:
Post a Comment