JS - 在循环内首先显示文本

Question

我正在使用 for 循环并在其中使用 if else if.

循环主要显示消息，首先显示 30 天内到达的消息，然后显示超过 30 天的消息。

但我需要放一个分隔符说 The following notifications are older than 30 days 如果我把它放在 else if 里面，它就会开始出现在 else if

里面的每条消息的顶部

       _.forEach(this.collection.models, function(model, index){

            <%
            var createdDateTime= new Date(created_at);
            var currentDateTime= new Date();
            var difference = Math.round((createdDateTime- currentDateTime) / (1000 * 60 * 60 * 24))

            if(difference > -30 ) { %>
            <div class="notification-box <%- read != true ? 'unread' : '' %>" data-type="<%- deeplink_type %>" data-id="<%- deeplink_id %>">
              <p class=""><%- message %></p>
              <p class="light-grey-text datetime-text" style="margin-top:0.5em;"><%- created_at %></p>
            </div>
            <% } else if(difference < -30 ) { %>

           <div class="blue banner server-banner" style="min-height: 25px; width: 100%; color: #fff; font-size: .7em; text-transform: uppercase; text-align: center; padding-top: 10px;">
              The following notifications are older than 30 days
            </div>

            <div class="notification-box <%- read != true ? 'unread' : '' %>" data-type="<%- deeplink_type %>" data-id="<%- deeplink_id %>">
              <p class=""><%- message %></p>
              <p class="light-grey-text datetime-text" style="margin-top:0.5em;"><%- created_at %></p>
            </div>
            <% } %>
       });

所以我的问题是，我怎样才能只在 else if 的第一次迭代中显示我想要的文本。

Answer 1

使用一个true/false开关来满足你的条件。根据该条件，您可以填充您的消息，前提是差异是按排序顺序排列的。

Answer 2

所以添加一个布尔检查。在 forEach

之前定义

var isFirst = true;

在 else

里面

if(isFirst) {
    isFirst = false;
    //output html
}

Answer 3

这是我的做法。您需要一个布尔值才能知道您至少有一次进入 else if 条件。然后在 else if 中使用此布尔值将被忽略，因为您将在第一次进入时将其设置为 true。

var isAlreadyDisplayed = false; 
_.forEach(this.collection.models, function(model, index){

        <%
        var createdDateTime= new Date(created_at);
        var currentDateTime= new Date();
        var difference = Math.round((createdDateTime- currentDateTime) / (1000 * 60 * 60 * 24))

        if(difference > -30 ) { %>
        <div class="notification-box <%- read != true ? 'unread' : '' %>" data-type="<%- deeplink_type %>" data-id="<%- deeplink_id %>">
          <p class=""><%- message %></p>
          <p class="light-grey-text datetime-text" style="margin-top:0.5em;"><%- created_at %></p>
        </div>
        <% } else if(difference < -30 && !isAlreadyDisplayed) { 
        isAlreadyDisplayed = true;         
        %>
       <div class="blue banner server-banner" style="min-height: 25px; width: 100%; color: #fff; font-size: .7em; text-transform: uppercase; text-align: center; padding-top: 10px;">
          The following notifications are older than 30 days
        </div>

        <div class="notification-box <%- read != true ? 'unread' : '' %>" data-type="<%- deeplink_type %>" data-id="<%- deeplink_id %>">
          <p class=""><%- message %></p>
          <p class="light-grey-text datetime-text" style="margin-top:0.5em;"><%- created_at %></p>
        </div>
        <% } %>
   });

JS - 在循环内首先显示文本

JS - Display a text on first else inside a loop

javascript

backbone.js