Sorting returned data

[bradbice]

Having trouble figuring out how to sort my returned JSON data. I’m trying to sort the data by the $element.modifier values. But everything I’ve tried in inserting sort has returned errors. Where should I be doing this?

(I tried putting {{ range sort . $element.modifier }} after the initial range but that didn’t work either.)

JSON data

{
    "props": {
        "NAME": {
            "value": "16px",
            "desc": "",
            "css": "padding",
            "modifier": "primary",
            "function": "",
            "color": "",
            "group": "",
            "element": "content",
            "breakpoint": "",
            "state": "",
            "environment": "",
            "hex": ""
        },
        ...
    }
}

Shortcode template:

{{ $pattern := .Get "pattern" }}
{{ $data := index .Site.Data.design_tokens $pattern }}
{{ range $index, $element := $data.props }}
Lines with {{ $element.modifier }} and more...
{{{ end }}

[dirkolbrich]

Does this thread helps?

[SOLVED] Ranging over collection of data files

A good nights sleep helped to think about this. range accepts maps, arrays and slices, first and where only accept an array or a slice. The data in the data/ folder will be accessible as a map in the .Site.Data variable. A map by Golang definitions is an unordered container for data, the order within that container is quite random. Posts in the content/ folder on the other side will be parsed into a slice of type Pages []*Page with a default order Default: Weight > Date > LinkTitle > Fil…

[bradbice]

Thank you for replying, but it doesn’t in the sense that I’m trying to sort the (kind of) already sorted returned data. I really just want to display the data according to one field alphabetically, or ideally, multiple fields concurrently.

[RickCogley]

Thinking outside the hugo box (and noting that you’re trying to it with hugo directly), you might look into jq, which is a utility for manipulating json data. I have found use for it in many projects. https://stedolan.github.io/jq/

[bradbice]

Thanks @RickCogley. I’ll take a look at it.

Still would be very surprised if this wasn’t fairly easy with Hugo, however.

[moorereason]

Try:

{{ range $index, $element := sort $data.props "modifier" }}

[bradbice]

{{ range $index, $element := sort $data.props “modifier” }}

@moorereason Yes! Thank you! This is the simple solution I’ve been looking for, and can’t believe I didn’t try. (or if I did, I likely missed some syntax bug).