【问题标题】:Umbraco C# - Display 2 different columns on foreach loop (1-2) (1-2)Umbraco C# - 在 foreach 循环中显示 2 个不同的列 (1-2) (1-2)
【发布时间】:2019-04-27 03:22:19
【问题描述】:

我正在尝试在foreach 循环(bootstarp 列)中以 1-2 的顺序显示来自 Umbraco 的数据,但我的代码以 1-1 列的顺序显示,而不是循环中的 1-2 .它不会将第二列添加到第二行,只是添加一列。

例如显示 1 项,然后 2 项,然后再显示 1 项,并显示不同的列。

在内容循环上制作 1-2 的更好方法是什么? 我有点迷失了这个。任何帮助都会很好。

 <div class="container-fluid" style="padding-left: 117px;">

   <div class="row" style="margin-top: 5em;">

    <div class="col-lg-9 col-md-9 col-sm-9">

      <!-- BLOG START-->

   @foreach(var data in Model.Content.Children().Where(x => !x.GetPropertyValue<bool>("umbracoNaviHide"))){

        if(data.HasValue("blogNested")){

           var items = data.GetPropertyValue<IEnumerable<IPublishedContent>>("blogNested");

           int i = 0 ;

            foreach(var item in items){

             <div class="row">

             @if(i % 2 == 0) {

               <div class="col-md-4 col-sm-12">
                    <div class="card">
                        <img src=" /media/1180/dude.jpg" style="height: 15em;">
                     </div>
                 </div> 

            <div class="col-md-6 col-sm-12">
                <span class="card-text qs-blog-direcao">@(item.GetPropertyValue<string>("tipoDeDirecao"))</span><br><br>
                <span class="qs-blog-date-1page">@(item.GetPropertyValue<string>("dataDePublicacaoBlog"))</span><br>
                <span class="qs-blog-publicado-por"> @(item.GetPropertyValue<string>("publicadoPorBlog")) - OPINIÃO </span><br><br><br>
                <span class="qs-blog-titulo-1page">@(item.GetPropertyValue<string>("tituloBlog"))</span>
            </div>   

            <div class="col-md-12 col-sm-12" style="margin-top:2em;">
                <span class="qs-blog-resumo d-flex justify-content-start">@(item.GetPropertyValue<string>("resumoBlog"))</span>
                <span class="d-flex justify-content-end"><a><img src=" /media/1027/icon_inf_verde.png"></a></span>
            </div>  



           } 

              else {

                <div class="col-md-6 col-sm-12">
                        <span class="card-text qs-blog-direcao-double">@(item.GetPropertyValue<string>("tipoDeDirecao"))</span><br>
                        <img src=" /media/1182/tempo.jpg" style="height: 10em;margin-top: 2em;">
                        <div class="qs-blog-sideByside">
                        <span class="qs-blog-date-1page-double">@(item.GetPropertyValue<string>("dataDePublicacaoBlog"))</span><br>
                        <span class="qs-blog-publicado-por-double"> @(item.GetPropertyValue<string>("publicadoPorBlog")) - OPINIÃO </span>
                        </div>
                        <div class="qs-blog-titulo-1page-double">@(item.GetPropertyValue<string>("tituloBlog"))</div>
                        <div class="qs-blog-resumo-blog d-flex justify-content-start">@(item.GetPropertyValue<string>("resumoBlog"))</div>
                        <span class="d-flex justify-content-end"><a><img src=" /media/1027/icon_inf_verde.png"></a></span>
                </div>

                }


           @{i++;}

   </div>


        }


    }  
}

  <!-- BLOG START-->
</div>

【问题讨论】:

    标签: c# asp.net-mvc asp.net-mvc-4 umbraco umbraco7


    【解决方案1】:

    可能是这样的

    var items = data.GetPropertyValue<IEnumerable<IPublishedContent>>("blogNested")
        .ToList();
    
    while (items.Any())
    {
        var oneItem = items.First();
        items.Remove(oneItem);
    
        <div class="row">
            <div class="col-md-12">
                @oneItem.Id
            </div>
        </div>
    
        var twoItems = items.Take(2).ToList();
    
        if (twoItems.Any())
        {
            <div class="row">
                @foreach (var item in twoItems)
                {
                    items.Remove(item);
                    <div class="md-6">
                        @item.Id
                    </div>
                }
            </div>
        }
    }
    

    这将呈现

    <div class="row">
        <div class="col-md-12">
            <text>{{Id}}</text>
        </div>
    </div>
    <div class="row">
        <div class="md-6">
            <text>{{Id}}</text>
         </div>
         <div class="md-6">
              <text>{{Id}}</text>
         </div>
    </div>
    <div class="row">
        <div class="col-md-12">
            <text>{{Id}}</text>
        </div>
    </div>
    ...
    

    【讨论】:

    • 我有点让它工作,我更新了上面的代码,但在第二行它只显示一个列
      而不是 2 之后if 语句
    • @yes i 的结果与上面的代码相同 row 1 item : 1 row 2 items : 2, row 1 item : 3, row 2 items : 4, row 1 item : 5
    • 但实际上想要这个结果row 1 : item 1, row 2 items : 2 &amp;&amp; 3 , row 1 item : 4 ect
    • 感谢它的工作。我做了一个类似的解决方案,但这个更好,谢谢你的时间;)干杯
    猜你喜欢
    相关资源
    最近更新 更多
    热门标签