循环树枝DIV并用我的JSON数组列出

时间:2019-02-08 18:04:50

标签: html json loops nested twig

伙计们,我有以下代码,每次我在JSON中使用extern时都会循环执行。效果很好。

但是,我在处理create procedure sp_pids_expand() begin declare done int default 0; declare v_p_id int; declare v_starts_on date; declare v_ends_on date; declare v_newday date; declare v_cnt int; declare c_pids cursor for select p_id, starts_on, ends_on from pids where date_add(starts_on, interval 1 month)<ends_on; declare continue handler for not found set done = 1; open c_pids; repeat fetch c_pids into v_p_id, v_starts_on, v_ends_on; if not done then set v_newday = v_starts_on; while (date_add(v_newday, interval 1 month)<v_ends_on) do set v_newday = date_add(v_newday, interval 1 month); select count(*) into v_cnt from pids where p_id=v_p_id and starts_on=v_newday and ends_on=v_ends_on; if (v_cnt=0) then insert into pids (p_id, starts_on, ends_on) values (v_p_id, v_newday, v_ends_on); end if; end while; end if; until done end repeat; close c_pids; end 元素的嵌套循环<section>时遇到问题。它变成空白,并且在我检查元素时似乎只循环了两次?

{% for list in lists %}

在我的JSON文件中,我将所有内容布置如下:

li

我希望{# Question 1 #} {% for question in questions %} <section> <div class="container question" id="question-one"> <div class="row row-eq-height"> <div class="gradient"></div> <div class="col-md-1 green-box"> <div class="number"><span>1</span></div> </div> <div class="col-md-10 dark-grey-box text-center"> <div class="content-wrapper"> {{ question.text|markdown }} {# SLIDER #} <div class="row"> <div class="col-md-8 offset-md-2"> <div class="slider-container"> <ul class="list-inline justify-content-center range-labels"> {% for list in lists %} <li class="list-inline-item"><img src="{{ list.img }}"><span>{{ list.label }}</span></li> {% endfor %} </ul> <div class="range-wrapper"> <img src="../resources/images-assets/images/place-holder-slider.png"> </div> </div> </div> </div> <div class="cta-wrapper"> <button id="question-one-submit" onclick="buttonClick()">DONATE £1</button> </div> </div> </div> <div class="col-sm-1 dark-grey-box"></div> </div> </div> </section> {% endfor %} 与相关图像和标签一起显示5次,就像我在JSON文件中添加的一样。

有人能指出我正确的方向吗?

1 个答案:

答案 0 :(得分:0)

我设法使它正常工作。这是标记:

{% for question in questions %}
<section>
<div class="container question" id="question-{{ loop.index }}">
    <div class="row row-eq-height">
        <div class="gradient"></div>
        <div class="col-md-1 green-box">
            <div class="number"><span>
                {{ loop.index }}
            </span></div>
        </div>
        <div class="col-md-10 dark-grey-box text-center">
            <div class="content-wrapper">

                {{ question.text|markdown }}
                {# SLIDER #}
                <div class="row">
                    <div class="col-md-8 offset-md-2">
                        <div class="slider-container">
                            <ul class="list-inline justify-content-center range-labels">
                                {% for option in question.options %}
                                    <li class="list-inline-item"><img src="{{ option.img }}"><span>{{ option.label }}</span></li>
                                {% endfor %}
                            </ul>
                            <div class="range-wrapper">
                                <img src="images/place-holder-slider.png">
                            </div>
                        </div>
                    </div>
                </div>

                <div class="cta-wrapper">
                    <button id="button-{{ loop.index }}" onclick="buttonClick()">{{ question.button }}</button>
                </div>

            </div>
        </div>
        <div class="col-sm-1 dark-grey-box"></div>
     </div>
</div>
</section>
{% endfor %}

我用来伴随的JSON文件如下:

"questions": [
    {
        "text": "##How confident are you in achieving your marketing goals this year?",
        "options": [
            { "img": "images/sad.svg", "label": "Dejected" },
            { "img": "images/thinking-2.svg", "label": "Doubtful" },
            { "img": "images/like.svg", "label": "Hopeful" },
            { "img": "images/check.svg", "label": "Upbeat" },
            { "img": "images/goal.svg", "label": "Surefire" }
        ],
        "button": "DONATE £1"
    },
    {
        "text": "##What are the greatest challenges you face?",
        "options": [
            { "img": "images/money-bag.svg", "label": "Budget" },
            { "img": "images/team.svg", "label": "Resources" },
            { "img": "images/bar-chart.svg", "label": "ROI" },
            { "img": "images/timer.svg", "label": "Short-termis" },
            { "img": "images/martech.svg", "label": "Martech" }
        ],
        "button": "DONATE £1"
    },
    {
        "text": "##Where could external agencies add the most value?",
        "options": [
            { "img": "images/networking.svg", "label": "ABM" },
            { "img": "images/increasing-stocks-graphic-of-bars.svg", "label": "Demand" },
            { "img": "images/options.svg", "label": "Strategy" },
            { "img": "images/full-items-inside-a-shopping-bag.svg", "label": "Sales Enablement" },
            { "img": "images/content.svg", "label": "Content" }
        ],
        "button": "DONATE £1"
    },
    {
        "text": "##Would you be interested in a further conversation?",
        "options": [
            { "img": "images/thumb-down.svg", "label": "Don't contact me again" },
            { "img": "images/maybe.svg", "label": "Unlikely this year" },
            { "img": "images/info.svg", "label": "Need to know more" },
            { "img": "images/calendar.svg", "label": "Get a date in the diary" },
            { "img": "images/boy-broad-smile.svg", "label": "Call me now" }
        ],
        "button": "DONATE £1"
    }
  ],