我正试图通过使用液体模板使用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>
提前致谢。
答案 0 :(得分:0)
在{% 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" => [...]
...
]
提示:使用检查过滤器{{ anyVariable | inspect }}
查看变量中的内容。适合调试。