Open mackelito opened 5 years ago
I have an object like this:
{ "data": { "cart": { "id": "d754932d-45e2-448f-baeb-b457aafd5ee3-47751", "orderItem": [ { "id": 956101, "categoryPaths": [ { "id": "6", "title": "Skafferi" }, { "id": "48", "title": "Flingor & Musli" }, { "id": "331", "title": "Flingor" } ] }, { "id": 956106, "categoryPaths": [ { "id": "6", "title": "Skafferi" }, { "id": "47", "title": "Bönor, Linser & Fröer" }, { "id": "269", "title": "Bönor" } ] }, { "id": 956107, "categoryPaths": [ { "id": "6", "title": "Skafferi" }, { "id": "47", "title": "Bönor, Linser & Fröer" }, { "id": "269", "title": "Bönor" } ] } ] } } }
Then mapping orderItems to cart.items.. all works fine.. then I do
<div *ngFor="let item of (cart.items | groupBy: 'categoryPaths.id' | pairs); trackBy: trackCartItem">{{item | json}}<div>
Now I was kind of hoping for some grouping magic but my object now looks more or less like this:
[ "undefined", [ { "externalId": "5053827193818", "title": "Special K Classic", "categoryPaths": [ { "id": "6", "title": "Skafferi" }, { "id": "48", "title": "Flingor & Musli" }, { "id": "331", "title": "Flingor" } ] }, { "externalId": "7350002402979", "title": "Svarta Bönor Ekologiska", "categoryPaths": [ { "id": "6", "title": "Skafferi" }, { "id": "47", "title": "Bönor, Linser & Fröer" }, { "id": "269", "title": "Bönor" } ] }, { "externalId": "7350002402948", "title": "Kidneybönor Ekologiska", "categoryPaths": [ { "id": "6", "title": "Skafferi" }, { "id": "47", "title": "Bönor, Linser & Fröer" }, { "id": "269", "title": "Bönor" } ] } ] ]
What am I missing?
Note: This does what I expect (prints the tilte)... but if I add | groupBy: 'categoryPaths.id' | keyvalue it behaves strange :)
| groupBy: 'categoryPaths.id' | keyvalue
<div *ngFor="let item of cart.items; trackBy: trackCartItem"> <div class="category" fxLayour="row" fxLayoutAlign="start center"> <div class="title">{{ item.title }}</div> </div> </div>
Also, how do we use it on TS files? We need an example for this one.
this.groupByPipe.transform(this.data, 'categoryPaths.id'), but do I still need the parisPipe? And how to combie with pairsPipe?
this.groupByPipe.transform(this.data, 'categoryPaths.id')
I have an object like this:
Then mapping orderItems to cart.items.. all works fine.. then I do
Now I was kind of hoping for some grouping magic but my object now looks more or less like this:
What am I missing?
Note: This does what I expect (prints the tilte)... but if I add
| groupBy: 'categoryPaths.id' | keyvalue
it behaves strange :)