Don't sort the Map when using ngForHow to iterate using ngFor loop Map containing key as string and values as map iterationInfinite loop with javascript (Angular NgFor and http request)ngFor with index as value in attributeAngular 2 - *ngFor : Is there a way to use an alternative end condition?*ngFor with two way binding in IONIC 2Parsing a nested JSON in ngFor when the keys are unknownANGULAR 2/4 : call function for each row in NgForDynamic style css font-size ngFor angular 4 ionic 3How to get a reference to the list in an ngfor with a pipe applied to itAngular *ngFor item changesionic storage ngFor
Different meanings of こわい
Sums of two squares in arithmetic progressions
Processor speed limited at 0.4 Ghz
What was Prahlada's age when his father was killed?
Small nick on power cord from an electric alarm clock, and copper wiring exposed but intact
Why did early computer designers eschew integers?
Error when overriding validators pipeline to create custom error text
How to install cross-compiler on Ubuntu 18.04?
How would the Beacon of Hope spell interact with the paladin's Lay on Hands feature?
How seriously should I take size and weight limits of hand luggage?
Avoiding the "not like other girls" trope?
What reasons are there for a Capitalist to oppose a 100% inheritance tax?
Collected fruit by Seine's banks
How dangerous is XSS
Why were 5.25" floppy drives cheaper than 8"?
Why was Sir Cadogan fired?
How badly should I try to prevent a user from XSSing themselves?
Spam email "via" my domain, but SPF record exists
Is there a rule of thumb for determining the amount one should accept for a settlement offer?
Can a virus destroy the BIOS of a modern computer?
Calculate the Mean mean of two numbers
When handwriting 黄 (huáng; yellow) is it incorrect to have a disconnected 草 (cǎo; grass) radical on top?
How could sorcerers who are able to produce/manipulate almost all forms of energy communicate over large distances?
Why can't we say "I have been having a dog"?
Don't sort the Map when using ngFor
How to iterate using ngFor loop Map containing key as string and values as map iterationInfinite loop with javascript (Angular NgFor and http request)ngFor with index as value in attributeAngular 2 - *ngFor : Is there a way to use an alternative end condition?*ngFor with two way binding in IONIC 2Parsing a nested JSON in ngFor when the keys are unknownANGULAR 2/4 : call function for each row in NgForDynamic style css font-size ngFor angular 4 ionic 3How to get a reference to the list in an ngfor with a pipe applied to itAngular *ngFor item changesionic storage ngFor
I am using ngFor to display a Map. To do so, I am using the keyvalue. It looks like this:
*ngFor="let upgrade of upgrades | keyvalue"
My Problem now is, that keyvalue sorts my Map. I don't want this and don't know how to stop the sorting.
I tried using sortOrder = (a): number => return (a); as compareFn; it worked, but I don't think that this is the corret way of doing it?
angular ionic-framework ionic4 edited Mar 8 at 22:09
georgeawg
34.4k115370
asked Mar 8 at 20:13
foo.doofoo.doo
15
add a comment |
I am using ngFor to display a Map. To do so, I am using the keyvalue. It looks like this:
*ngFor="let upgrade of upgrades | keyvalue"
My Problem now is, that keyvalue sorts my Map. I don't want this and don't know how to stop the sorting.
I tried using sortOrder = (a): number => return (a); as compareFn; it worked, but I don't think that this is the corret way of doing it?
angular ionic-framework ionic4 edited Mar 8 at 22:09
georgeawg
34.4k115370
asked Mar 8 at 20:13
foo.doofoo.doo
15
1
This might be sidetracking, but, what is wrong with actually sorting the info? Usually that makes it nicer for the end user's view :)
– Alejandro Vales
Mar 8 at 22:17
add a comment |
I am using ngFor to display a Map. To do so, I am using the keyvalue. It looks like this:
*ngFor="let upgrade of upgrades | keyvalue"
My Problem now is, that keyvalue sorts my Map. I don't want this and don't know how to stop the sorting.
I tried using sortOrder = (a): number => return (a); as compareFn; it worked, but I don't think that this is the corret way of doing it?
angular ionic-framework ionic4 edited Mar 8 at 22:09
georgeawg
34.4k115370
asked Mar 8 at 20:13
foo.doofoo.doo
15
I am using ngFor to display a Map. To do so, I am using the keyvalue. It looks like this:
*ngFor="let upgrade of upgrades | keyvalue"
My Problem now is, that keyvalue sorts my Map. I don't want this and don't know how to stop the sorting.
I tried using sortOrder = (a): number => return (a); as compareFn; it worked, but I don't think that this is the corret way of doing it?
angular ionic-framework ionic4 angular ionic-framework ionic4 edited Mar 8 at 22:09
georgeawg
34.4k115370
asked Mar 8 at 20:13
foo.doofoo.doo
15
edited Mar 8 at 22:09
georgeawg
34.4k115370
asked Mar 8 at 20:13
foo.doofoo.doo
15
edited Mar 8 at 22:09
georgeawg
34.4k115370
edited Mar 8 at 22:09
georgeawg
34.4k115370
edited Mar 8 at 22:09
georgeawg
34.4k115370
34.4k115370
asked Mar 8 at 20:13
foo.doofoo.doo
15
asked Mar 8 at 20:13
foo.doofoo.doo
15
asked Mar 8 at 20:13
foo.doofoo.doo
15
15
1
This might be sidetracking, but, what is wrong with actually sorting the info? Usually that makes it nicer for the end user's view :)
– Alejandro Vales
Mar 8 at 22:17
add a comment |
1
This might be sidetracking, but, what is wrong with actually sorting the info? Usually that makes it nicer for the end user's view :)
– Alejandro Vales
Mar 8 at 22:17
1
1
This might be sidetracking, but, what is wrong with actually sorting the info? Usually that makes it nicer for the end user's view :)
– Alejandro Vales
Mar 8 at 22:17
This might be sidetracking, but, what is wrong with actually sorting the info? Usually that makes it nicer for the end user's view :)
– Alejandro Vales
Mar 8 at 22:17
add a comment |
2 Answers
2
active
oldest
votes
since you are working with Map, If you do not want to sort the key
you can use
*ngFor="let key of upgrades.keys()"
or
*ngFor="let entry of upgrades.entries()"
if you still want to use keyvalue pipe, your way is the right way. although it's a little confusing.
Since compareFn return a number, your sortOrder function will probably understand as null or NaN. I prefer (a,b)=>1 to be more clear. But it does not matter, the sorting is still happening, and probably waste some CPU time.
answered Mar 8 at 22:57
HaijinHaijin
1,2161619
I did actually see that attempt here: link. But, as mentioned there, this doesn't work.
– foo.doo
Mar 9 at 1:11
Surprised to see that does not work, but good to know. Thanks.
– Haijin
Mar 9 at 2:34
add a comment |
Yes, the keyvalue pipe does sort by the keys. I suspect this was a requirement for ngClass and ngStyle, because this was mentioned in the source code comments.
You can't stop the sorting. I'd just create my own pipe.
@Pipe(name: 'entries', pure: true)
export class EntriesPipe implements PipeTransform
transform(value: May<any,any>)
return Array.from(value.entries());
I made the pipe pure, but that's up to you. It's difficult to work with Map<> types if it's pure.
answered Mar 9 at 2:15
cgTagcgTag
24.4k864114
Sidenote: although this will work, you will lose some of the optimizations that the keyvalue pipe has github.com/angular/angular/blob/7.2.8/packages/common/src/pipes/…
– Jota.Toledo
Mar 9 at 8:19
add a comment |
Your Answer
StackExchange.ifUsing("editor", function ()
StackExchange.using("externalEditor", function ()
StackExchange.using("snippets", function ()
StackExchange.snippets.init();
);
);
, "code-snippets");
StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "1"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);
else
createEditor();
);
function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);
);
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55070393%2fdont-sort-the-map-when-using-ngfor%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
2 Answers
2
active
oldest
votes
2 Answers
2
active
oldest
votes
active
oldest
votes
active
oldest
votes
since you are working with Map, If you do not want to sort the key
you can use
*ngFor="let key of upgrades.keys()"
or
*ngFor="let entry of upgrades.entries()"
if you still want to use keyvalue pipe, your way is the right way. although it's a little confusing.
Since compareFn return a number, your sortOrder function will probably understand as null or NaN. I prefer (a,b)=>1 to be more clear. But it does not matter, the sorting is still happening, and probably waste some CPU time.
answered Mar 8 at 22:57
HaijinHaijin
1,2161619
I did actually see that attempt here: link. But, as mentioned there, this doesn't work.
– foo.doo
Mar 9 at 1:11
Surprised to see that does not work, but good to know. Thanks.
– Haijin
Mar 9 at 2:34
add a comment |
since you are working with Map, If you do not want to sort the key
you can use
*ngFor="let key of upgrades.keys()"
or
*ngFor="let entry of upgrades.entries()"
if you still want to use keyvalue pipe, your way is the right way. although it's a little confusing.
Since compareFn return a number, your sortOrder function will probably understand as null or NaN. I prefer (a,b)=>1 to be more clear. But it does not matter, the sorting is still happening, and probably waste some CPU time.
answered Mar 8 at 22:57
HaijinHaijin
1,2161619
I did actually see that attempt here: link. But, as mentioned there, this doesn't work.
– foo.doo
Mar 9 at 1:11
Surprised to see that does not work, but good to know. Thanks.
– Haijin
Mar 9 at 2:34
add a comment |
since you are working with Map, If you do not want to sort the key
you can use
*ngFor="let key of upgrades.keys()"
or
*ngFor="let entry of upgrades.entries()"
if you still want to use keyvalue pipe, your way is the right way. although it's a little confusing.
Since compareFn return a number, your sortOrder function will probably understand as null or NaN. I prefer (a,b)=>1 to be more clear. But it does not matter, the sorting is still happening, and probably waste some CPU time.
answered Mar 8 at 22:57
HaijinHaijin
1,2161619
since you are working with Map, If you do not want to sort the key
you can use
*ngFor="let key of upgrades.keys()"
or
*ngFor="let entry of upgrades.entries()"
if you still want to use keyvalue pipe, your way is the right way. although it's a little confusing.
Since compareFn return a number, your sortOrder function will probably understand as null or NaN. I prefer (a,b)=>1 to be more clear. But it does not matter, the sorting is still happening, and probably waste some CPU time.
answered Mar 8 at 22:57
HaijinHaijin
1,2161619
edited Mar 8 at 23:04
answered Mar 8 at 22:57
HaijinHaijin
1,2161619
answered Mar 8 at 22:57
HaijinHaijin
1,2161619
answered Mar 8 at 22:57
HaijinHaijin
1,2161619
1,2161619
I did actually see that attempt here: link. But, as mentioned there, this doesn't work.
– foo.doo
Mar 9 at 1:11
Surprised to see that does not work, but good to know. Thanks.
– Haijin
Mar 9 at 2:34
add a comment |
I did actually see that attempt here: link. But, as mentioned there, this doesn't work.
– foo.doo
Mar 9 at 1:11
Surprised to see that does not work, but good to know. Thanks.
– Haijin
Mar 9 at 2:34
I did actually see that attempt here: link. But, as mentioned there, this doesn't work.
– foo.doo
Mar 9 at 1:11
I did actually see that attempt here: link. But, as mentioned there, this doesn't work.
– foo.doo
Mar 9 at 1:11
Surprised to see that does not work, but good to know. Thanks.
– Haijin
Mar 9 at 2:34
Surprised to see that does not work, but good to know. Thanks.
– Haijin
Mar 9 at 2:34
add a comment |
Yes, the keyvalue pipe does sort by the keys. I suspect this was a requirement for ngClass and ngStyle, because this was mentioned in the source code comments.
You can't stop the sorting. I'd just create my own pipe.
@Pipe(name: 'entries', pure: true)
export class EntriesPipe implements PipeTransform
transform(value: May<any,any>)
return Array.from(value.entries());
I made the pipe pure, but that's up to you. It's difficult to work with Map<> types if it's pure.
answered Mar 9 at 2:15
cgTagcgTag
24.4k864114
Sidenote: although this will work, you will lose some of the optimizations that the keyvalue pipe has github.com/angular/angular/blob/7.2.8/packages/common/src/pipes/…
– Jota.Toledo
Mar 9 at 8:19
add a comment |
Yes, the keyvalue pipe does sort by the keys. I suspect this was a requirement for ngClass and ngStyle, because this was mentioned in the source code comments.
You can't stop the sorting. I'd just create my own pipe.
@Pipe(name: 'entries', pure: true)
export class EntriesPipe implements PipeTransform
transform(value: May<any,any>)
return Array.from(value.entries());
I made the pipe pure, but that's up to you. It's difficult to work with Map<> types if it's pure.
answered Mar 9 at 2:15
cgTagcgTag
24.4k864114
Sidenote: although this will work, you will lose some of the optimizations that the keyvalue pipe has github.com/angular/angular/blob/7.2.8/packages/common/src/pipes/…
– Jota.Toledo
Mar 9 at 8:19
add a comment |
Yes, the keyvalue pipe does sort by the keys. I suspect this was a requirement for ngClass and ngStyle, because this was mentioned in the source code comments.
You can't stop the sorting. I'd just create my own pipe.
@Pipe(name: 'entries', pure: true)
export class EntriesPipe implements PipeTransform
transform(value: May<any,any>)
return Array.from(value.entries());
I made the pipe pure, but that's up to you. It's difficult to work with Map<> types if it's pure.
answered Mar 9 at 2:15
cgTagcgTag
24.4k864114
Yes, the keyvalue pipe does sort by the keys. I suspect this was a requirement for ngClass and ngStyle, because this was mentioned in the source code comments.
You can't stop the sorting. I'd just create my own pipe.
@Pipe(name: 'entries', pure: true)
export class EntriesPipe implements PipeTransform
transform(value: May<any,any>)
return Array.from(value.entries());
I made the pipe pure, but that's up to you. It's difficult to work with Map<> types if it's pure.
answered Mar 9 at 2:15
cgTagcgTag
24.4k864114
answered Mar 9 at 2:15
cgTagcgTag
24.4k864114
answered Mar 9 at 2:15
cgTagcgTag
24.4k864114
answered Mar 9 at 2:15
cgTagcgTag
24.4k864114
24.4k864114
Sidenote: although this will work, you will lose some of the optimizations that the keyvalue pipe has github.com/angular/angular/blob/7.2.8/packages/common/src/pipes/…
– Jota.Toledo
Mar 9 at 8:19
add a comment |
Sidenote: although this will work, you will lose some of the optimizations that the keyvalue pipe has github.com/angular/angular/blob/7.2.8/packages/common/src/pipes/…
– Jota.Toledo
Mar 9 at 8:19
Sidenote: although this will work, you will lose some of the optimizations that the keyvalue pipe has github.com/angular/angular/blob/7.2.8/packages/common/src/pipes/…
– Jota.Toledo
Mar 9 at 8:19
Sidenote: although this will work, you will lose some of the optimizations that the keyvalue pipe has github.com/angular/angular/blob/7.2.8/packages/common/src/pipes/…
– Jota.Toledo
Mar 9 at 8:19
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55070393%2fdont-sort-the-map-when-using-ngfor%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
1
This might be sidetracking, but, what is wrong with actually sorting the info? Usually that makes it nicer for the end user's view :)
– Alejandro Vales
Mar 8 at 22:17