Ranging over a set of values

support
1

Hi

I’ve been scratching my head about this for a while and have been though the docs and look at various support threads but have not yet been able to resolve this.

In the YAML front matter I have

group1FeatureSet1:
  - feature:
    heading: "Device Enrolment"
    description: "Automatically enrols devices into your Mobile Device Management (MDM) solution."
  - feature:
    heading: "Managed Apple IDs"
    description: "Create and manage Apple IDs specifically for your organisation. "

and I want to range over the features and display the heading and description. This is the current version of my code

        {{ with .Params.groupFeatureSet1 }}
          <ul>
            {{ range . }}
              <li>
                <h3>{{ .heading | safeHTML }}</h3>
                <p>{{ .description | safeHTML }}</p>
              </li>
            {{- end -}}
          </ul>
        {{- end -}}

Nothing is displayed and no error is shown. There’s something I’m misunderstanding here. Can anyone help?

Thanks

2

I believe this is rather a Go templating issue, rather than a Hugo one. I’ve not tried this but, I would adapt my template to match something like this

3

  1. group1FeatureSet1 is a custom parameter - with recent hugo versions this should be under params key.

    ---
params:
  group1FeatureSet1:
    - feature:
      heading: "Device Enrolment"
...
---

  2. you have a typo in the loop:

    wrong:   `{{ with .Params.groupFeatureSet1 }}
correct: `{{ with .Params.group1FeatureSet1 }}   <-- mind that 1 ;-)

  3. no need to pipe to safeHTML if you just have text in the field

4

Thanks for your speedy reply. I looked at the YAML and used the link on the page you suggested to convert it to JSON. It wasn’t quite what I expected!

I tried other ways of formatting the front matter but without any change to the result.

5

Thanks. I have used the newer syntax for params (after upgrading my version of HUGO) and fixed that typo you pointed out.

Front matter is now

params:
  group1FeatureSet1:
    - heading: "Device Enrolment"
      description: "Automatically enrols devices into your Mobile Device Management (MDM) solution."
    - heading: "Managed Apple IDs"
      description: "Create and manage Apple IDs specifically for your organisation."

The page now contains

      {{ with .Params.group1FeatureSet1 }}
      <div class="list-plus-callout">
        {{ partial "service-key-features-list.html" . }}
      {{- end -}}
      </div>

And the partial is

  <ul>
    {{ range . }}
      <li>
        <h3>{{ .heading }}</h3>
        <p>{{ .description }}</p>
      </li>
    {{- end -}}
  </ul>

This works perfectly and I’m pleased to have been able to hive off code into a partial as a I have several occurrences of these FeatureSets.

Thanks for your help.

Roger

1 Like
6

This topic was automatically closed 2 days after the last reply. New replies are no longer allowed.