I need to organize a product list sorted by Array of String as properties of Array of objects
example: Case 1
<div *ngFor="let producto of productos| orderBy:'nombre,descripcion' : 'ASC' || 'DES'"></div>
example: Case 2
<div *ngFor="let producto of productos| orderBy:['nombre','descripcion'] : 'ASC' || 'DES'"></div>
example: Case 3
<div *ngFor="let producto of productos| orderBy: ordenPropiedades : 'ASC' || 'DES'"></div>
Based on your comment, I leave reflected the answer for future references:
File miPipe.ts:
@Pipe({
name: 'ordenar'
})
export class Ordenar implements PipeTransform {
transform(values: Array<any>, propiedades: string[], direccion: string[] ): Array<any> {
// en el atributo dirreccion se escribe "des" o "DES" para invertir el orden en sentido descendente y "asc" o "ASC" para un orden ascendente
for( let x = propiedades.length-1; x >=0 ; x-- ){
let mapped = values.map(function( el, i ) {
return { index: i, value: el };
})
mapped.sort(function(a, b) {
return +( a.value[propiedades[x]] > b.value[propiedades[x]]) || +(a.value[propiedades[x]] === b.value[propiedades[x]] ) - 1;
});
values = mapped.map(function(el){
return values[el.index];
});
if( direccion[x] === "des" || direccion[x] === "DES" ){
values = values.reverse();
}
}
return values;
}
}
File html :
<ion-item *ngFor=" let producto of productos | ordenar: [ 'category', 'p_name', 'favorito' ] : [ 'asc', 'asc', 'des' ]; let i = index ">
{{producto.p_name}}
...
</ion-item>
I also leave the functional example in a plnkr, in which I also leave the original solution in case someone else can find different variations that may be useful: link
Thank you in advance and greetings.