It doesn't sort by hour. It sorts by alphabetical order: '1' is before '2', which is before '8'. You'll have to avoid using formatted dates when sorting. If you use ISO-formatted dates, then the alphabetical order is also the chornological order. If you use Date object, then you need to use a comparator function when sorting, which compares them. If your model contains non-ISO formatted dates, then you should fix your design, because that's an abomination 🙂
#Problem with sorting date in table.
tardy bramble
tardy bramble
The Date constructor expects numbers as arguments. You're passing the result of split(), which is strings. Again, you should avoid having formatted dates in your model.
tardy bramble
I have given the same suggestion, again and again.
- Don't use formatted dates in your model
- If really you want to keep doing that atrocity, parse the formatted date correctly to transform it to a Date, and return that Date's milliseconds value from your sortingAccessor.
Have you tried doing any of those?
If you have to post code, post it as text, as explained below:
g!codeblock @north flume
dry inletBOT
@north flume, you can use the following snippet to have your code formatted and colored by Discord. Replace ts with the language you need (i.e. html, js, css, etc)
```ts
// your code goes here
```
tardy bramble
You're almost there, but https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/getMilliseconds doesn't return the timestamp of the date. You need to use https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/getTime.
Learn to debug your code, using a debugger, or simply by adding console.log() calls inside. If you logged the value of the value you're returning from getTime(), you would realize it's always 0.
Also, you're doing things in the wrong place. The column's getValue must return the value being displayed. It's not a timestamp. The sortingDataAccessor, on the other hand, must return the value to compare when sorting. That must be the timestamp.
tardy bramble
The message says it all: you're calling element.timeStamp.split(), and element.timeStamp is undefined. Decide what you want to do when you don't have a timestamp (and fix your types: the compiler would warn you if element.timestamp had the correct type (i.e. string | undefined)
Great, but I'll say it again: instead of having formatted dates and having to parse them. You should have Date objects or ISO strings, and simply use the Angular date pipe to format them the way you want when displaying them. The way you've done it, not only it's not efficient, but you'll have to do it oer and over again every time you will have to manipulate the dates, and if you want to display the dates in another way, everything will fall apart.