Как вы используете цикл for внутри оператора if с языком шаблонов Liquid? - PullRequest
Новая
       7

Как вы используете цикл for внутри оператора if с языком шаблонов Liquid?

0 голосов
/ 24 мая 2018

Я пытаюсь сделать часть сайта динамичной, используя Jekyll с жидким шаблоном.Я впервые использую его, поэтому я не уверен, почему он не работает. Я связываю файл json с жидкостью.

Вот как должны выглядеть результаты: 

            <p><strong>University Union Neighborhood</strong></p>
            <div class="label_input_grouping">
                <label><input type="checkbox" name="location" value="The Avenue" onclick="document.getElementById('chk1').checked = this.checked;" />The Avenue</label> 
                <label><input type="checkbox" name="location" value="Chick Fil-A" onclick="document.getElementById('chk2').checked = this.checked;" />Chick Fil-A</label> 
                <label><input type="checkbox" name="location" value="805 Kitchen" onclick="document.getElementById('chk3').checked = this.checked;" />805 Kitchen</label> 
                <label><input type="checkbox" name="location" value="805 Cafe" onclick="document.getElementById('chk31').checked = this.checked;" />805 Cafe</label> 
                <label><input type="checkbox" name="location" value="Myron's" onclick="document.getElementById('chk4').checked = this.checked;" />Myron's - NEW THIS FALL</label> 
                <label><input type="checkbox" name="location" value="Lucys" onclick="document.getElementById('chk5').checked = this.checked;" />Lucy's Juice</label> 
                <label><input type="checkbox" name="location" value="Sandwich Factory" onclick="document.getElementById('chk6').checked = this.checked;" />Sandwich Factory</label>
                <label><input type="checkbox" name="location" value="Mustang Station" onclick="document.getElementById('chk7').checked = this.checked;" />Mustang Station</label> 
                <label><input type="checkbox" name="location" value="Red Radish" onclick="document.getElementById('chk8').checked = this.checked;" />Red Radish</label>
                <label><input type="checkbox" name="location" value="Starbucks-UU" onclick="document.getElementById('chk9').checked = this.checked;" />Starbucks University Union</label>
            </div>


            <p><strong>Kennedy Library Neighborhood</strong></p>
            <div class="label_input_grouping">
                <label><input type="checkbox" name="location" value="Campus Market" onclick="document.getElementById('chk10').checked = this.checked;" />Campus Market</label>
                <label><input type="checkbox" name="location" value="Starbucks-CM" onclick="document.getElementById('chk11').checked = this.checked;" />Starbucks Campus Market</label> 
                <label><input type="checkbox" name="location" value="Julians" onclick="document.getElementById('chk12').checked = this.checked;" />Julian's Cafe Bistro in Kennedy Library</label> 
                <label><input type="checkbox" name="location" value="Tacos To-Go Express" onclick="document.getElementById('chk13').checked = this.checked;" />Tacos To-Go Express</label>
            </div>


            <p><strong>Poly Canyon Village Neighborhood</strong></p>
            <div class="label_input_grouping">
                <label><input type="checkbox" name="location" value="Einstein Bros. Bagels" onclick="document.getElementById('chk14').checked = this.checked;" />Einstein Bros. Bagels</label>
                <label><input type="checkbox" name="location" value="Jamba Juice" onclick="document.getElementById('chk15').checked = this.checked;" />Jamba Juice</label>
                <label><input type="checkbox" name="location" value="Tacos To-Go Mexican Grill" onclick="document.getElementById('chk16').checked = this.checked;" />Tacos To-Go Mexican Grill</label> 
                <label><input type="checkbox" name="location" value="Village Market" onclick="document.getElementById('chk17').checked = this.checked;" />Village Market</label> 
            </div>

        </div>


        <div class="options">

            <p><strong>Support Units</strong></p>
            <div class="label_input_grouping">
                <label><input type="checkbox" name="location" value="Catering" onclick="document.getElementById('chk18').checked = this.checked;" />University Catering</label> 
                <label><input type="checkbox" name="location" value="Concessions" onclick="document.getElementById('chk19').checked = this.checked;" />Mustang Concessions</label> 
                <label><input type="checkbox" name="location" value="Curbside" onclick="document.getElementById('chk20').checked = this.checked;" />Curbside Grill Food Truck</label> 
                <label><input type="checkbox" name="location" value="Central Coaster" onclick="document.getElementById('chk21').checked = this.checked;" />Central Coaster Food Truck - NEW THIS FALL</label> 
                <label><input type="checkbox" name="location" value="Starbucks Coffee Truck" onclick="document.getElementById('chk22').checked = this.checked;" />Starbucks Coffee Truck - NEW THIS FALL</label>
            </div>


            <p><strong>Other Food Service Units</strong></p>
            <div class="label_input_grouping">
                <label><input type="checkbox" name="location" value="Bakery" onclick="document.getElementById('chk23').checked = this.checked;" />Bake Shop</label>
                <label><input type="checkbox" name="location" value="Salad Room" onclick="document.getElementById('chk24').checked = this.checked;" />Salad Room (Grab and Go production)</label>
                <label><input type="checkbox" name="location" value="Central Kitchen" onclick="document.getElementById('chk25').checked = this.checked;" />Central Kitchen</label>
                <label><input type="checkbox" name="location" value="Dishwashing" onclick="document.getElementById('chk26').checked = this.checked;" />Dishwashing</label>
                <label><input type="checkbox" name="location" value="Maintenance" onclick="document.getElementById('chk27').checked = this.checked;" />Maintenance</label>
                <label><input type="checkbox" name="location" value="Warehouse" onclick="document.getElementById('chk28').checked = this.checked;" />Warehouse/Delivery</label>
                <label><input type="checkbox" name="location" value="Custodial" onclick="document.getElementById('chk29').checked = this.checked;" />Custodial</label>
                <label><input type="checkbox" name="location" value="Maintenance" onclick="document.getElementById('chk30').checked = this.checked;" />Maintenance</label>
                <label><input type="checkbox" name="location" value="Administration" onclick="document.getElementById('chk31').checked = this.checked;" />Administration/Accounting</label>
            </div>

        </div>
    </div>

Это часть файла json: 

[
 {
"staffID": "chk1",
"name": "The Avenue",
"email/1": "rvpatter@calpoly.edu",
"email/2": "mvedrin@calpoly.edu",
"email/3": "",
"email/4": "",
"location": "University Union"
},

{
"staffID": "chk10",
"name": "Campus Market",
"email/1": "khamil05@calpoly.edu",
"email/2": "siramire@calpoly.edu",
"email/3": "rmonteat@calpoly.edu",
"email/4": "",
"location": "Kennedy Library Neighborhood"
},

 {
"staffID": "chk14",
"name": "Einstein Bros. Bagels",
"email/1": "brweaver@calpoly.edu",
"email/2": "mburns03@calpoly.edu",
"email/3": "srios@calpoly.edu",
"email/4": "",
"location": "Poly Canyon Village Neighborhood"
},

{
"staffID": "chk18",
"name": "Catering",
"email/1": "elammers@calpoly.edu",
"email/2": "cstocker@calpoly.edu",
"email/3": "rmonteat@calpoly.edu",
"email/4": "",
"location": "Support Units"
},

 {
"staffID": "chk23",
"name": "Bakery",
"email/1": "kcphilli@calpoly.edu",
"email/2": "mdevad@calpoly.edu",
"email/3": "",
"email/4": "",
"location": "Other Food Service Units"
},
]

Это мой жидкий код: 

          <div class="options">
            {% assign target_restaurants = site.data.apply %}

            {% if restaurant.location == 'University Union' %}
                <p><strong>University Union Neighborhood</strong></p>
                <div class="label_input_grouping">
                    {% for restaurant in target_restaurants %}
                        <label><input type="checkbox" name="location" value="{{ restaurant['name'] }}"  onclick="document.getElementById('{{ restaurant['staffID'] }}').checked = this.checked;">{{ restaurant['name'] }}</label>
                    {% endfor %}
                </div>

            {% elsif restaurant.location == 'Kennedy Library Neighborhood' %}
                <p><strong>Kennedy Library Neighborhood</strong></p>

                <div class="label_input_grouping">
                    {% for restaurant in target_restaurants %}
                        <label><input type="checkbox" name="location" value="{{ restaurant['name'] }}"  onclick="document.getElementById('{{ restaurant['staffID'] }}').checked = this.checked;">{{ restaurant['name'] }}</label>
                    {% endfor %}
                </div>  

            {% elsif restaurant.location == 'Kennedy Library Neighborhood' %}
                <p><strong>Poly Canyon Village Neighborhood</strong></p>                
                {% for restaurant in target_restaurants %}
                <div class="label_input_grouping">
                <label><input type="checkbox" name="location" value="{{ restaurant['name'] }}"  onclick="document.getElementById('{{ restaurant['staffID'] }}').checked = this.checked;">{{ restaurant['name'] }}</label>
                </div>
                {% endfor %}

            {% else %}
            {% endif %}
        </div>

        <div class="options">
            {% assign target_restaurants = site.data.apply %}

            {% if restaurant.location == 'Support Units' %}
                <p><strong>Support Units</strong></p>

                <div class="label_input_grouping">
                    {% for restaurant in target_restaurants %}
                        <label><input type="checkbox" name="location" value="{{ restaurant['name'] }}"  onclick="document.getElementById('{{ restaurant['staffID'] }}').checked = this.checked;">{{ restaurant['name'] }}</label>
                    {% endfor %}
                </div>

            {% elsif restaurant.location == 'Other Food Service Units' %}
                <p><strong>Other Food Service Units</strong></p>

                <div class="label_input_grouping">
                    {% for restaurant in target_restaurants %}
                        <label><input type="checkbox" name="location" value="{{ restaurant['name'] }}"  onclick="document.getElementById('{{ restaurant['staffID'] }}').checked = this.checked;">{{ restaurant['name'] }}</label>
                    {% endfor %}
                </div>  
            {% else %}
            {% endif %}
        </div>

Мой результат при компиляции просто пуст: 

        <div class="options">

        </div>

        <div class="options">

        </div>

Заранее спасибо.

1 Ответ

0 голосов
/ 25 мая 2018

В таких сравнениях, как {% if restaurant.location == 'University Union' %}, переменная restaurant никогда не устанавливается, равенство не встречается и код не печатается.

Если вы просто хотите вывести список ресторанов сгруппированных по местоположению, вы можете сделать:

{% assign groups = site.data.apply | group_by:'location' %}

{% for location in groups %}
<div class="options">
  <p><strong>{{ location.name }}</strong></p>
  <div class="label_input_grouping">
    {% for restaurant in location.items %}
      <label><input type="checkbox" name="location" value="{{ restaurant.name }}" onclick="document.getElementById('{{ restaurant.staffID }}').checked = this.checked;">{{ restaurant.name }}</label>
    {% endfor %}
  </div>
</div>
{% endfor %}

Фильтр group_by будет хранить все ваши записи из data.apply в массиве, подобном: 

[
  {"name"=>"University Union", 
   "items"=>[
       {"staffID"=>"chk1", "name"=>"The Avenue", .... }
   ], 
   "size"=>1
  }, 
  {"name"=>"Kennedy Library Neighborhood",
   "items" => [...]
   ...
]

Совет: используйте inspect filter {{ anyVariable | inspect }}, чтобы увидеть, что в вашемпеременные.Хорошо для отладки.

...