Modifying nested range collection name based on outer loop

Hi, I am completely new to Hugo - already love how powerful it is!
I am able to iterate over .Pages, .Title in the outer loop shown in code snippet.

However the inner loop only iterates over one section of the .Site.Data (Since I hard-coded it as .FRUITS).

<div>
    {{ range .Pages }}
    <div>
        <div>
            <h3>{{ .Title }}</h3>
        </div>
        <div>
            {{ with .Site.Data.pricelist }}
            <ul class="leaders">
                {{ range .FRUITS }}
                <li>
                    <span>{{ .item}}</span>
                    <span>{{ .price }}</span>
                </li>
                {{ end }}
            </ul>
            {{ end }}
        </div>
    </div>
    {{ end }}
</div>

Instead of hard-coding .FRUITS I would like to use .Title (dynamically from the outer loop). That way the price list will rotate based on the .Title. Currently, this is how the page is rendered:

This is the pricelist.yml file:

enable : true
heading : "Prices"
FRUITS:
  - service: "Apple"
    price: "$50"

  - service: "Pear"
    price: "$40"
VEGETABLES:
  - service: "Carrot"
    price: "$50"

  - service: "Onion"
    price: "$40"

I did try numerous methods I found here but I was not successful. I am not opposed to using another method.
Thank you for your time!
Kevin

the Title of the current page I presume. Your page’s context should be the root context stored in $.

        {{ with .Site.Data.pricelist }}
            <ul class="leaders">
                {{ range index . $.Title }}
                <li>
                    <span>{{ .item}}</span>
                    <span>{{ .price }}</span>
                </li>
                {{ end }}
            </ul>
            {{ end }}

See Hugo, the scope, the context and the dot | Regis Philibert

Thank you for your recommendation.

The page does not error out. However, it does not pull from the sections of the pricelist.yml file based on the .Title of the pages (from the outer range). There is no data as pictured:
First Image

The desired output would look like this:
Second Image

Based on data in the pricelist.yml file
Third Image

I am not opposed to using the .md files; however, I am not sure how to loop over data in there
Fourth image

I used .item in my initial post for simplicity sake but my code actually says .service. Apologies for posting both ways. I did test properly :slight_smile:

Thank so much for your help

Maybe a case (as in upper case) problem. Do you have a repo to share? Thanks.

Thanks @regis
repo: GitHub - kevinblumenfeld/SugarTime at staging
sub: GitHub - kevinblumenfeld/SugarTime-RoxoTheme

Please let me know if I can provide any additional information. Thanks again
Kevin

You still have a context problem. Do this:

diff --git a/layouts/services/list.html b/layouts/services/list.html
index 136bc88..31753b6 100644
--- a/layouts/services/list.html
+++ b/layouts/services/list.html
@@ -98,7 +98,7 @@
 <section class="site-project" id="project">
     <div class="container">
         <div class="row">
-            {{ range .Pages }}
+            {{ range $p := .Pages }}
 
             <div class="col-lg-6 col-md-10 mx-auto">
                 <div class="site-project-item">
@@ -110,7 +110,7 @@
                     <div class="site-project-item-thumb">
                         {{ with .Site.Data.pricelist }}
                         <ul class="leaders">
-                            {{ range index . $.Title }}
+                            {{ range index . $p.Title }}
                             <li>
                                 <span>{{ .service }}</span>
                                 <span>{{ .price }}</span>

That worked perfectly! Thank you so much!

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