Angular: Is there a way to iterate over Map<,> without sorting?

Viewed 242

I've got a Map<string, customObject> and I want to iterate over it using *ngFor.

I tried *ngFor="let mapItems of map | keyvalue" but this one sorts the keys in ascending order. I don't want the Map to be sorted at all. The values should be displayed in the original order.

Is there a way to achieve this?

1 Answers

You can write custom pipe.

@Pipe({
  name: "appmap"
})
export class AppMap implements PipeTransform {
  transform(m: Map<string, object>): any[] {
    console.log([...m]);
    return [...m];
  }
}

and can use like

<div *ngFor="let item of map | appmap">
    {{item[0]}}:{{item[1] |json }}
  </div>

Sample:

https://codesandbox.io/s/heuristic-ellis-hmw2p

Related