遍历前 5 个项目，然后创建 ul 并列出其余项目

Question

我正在尝试在博客列表上创建某种排序功能。我想输出前 5 个项目，然后创建一个更多按钮，并列出其余的类别以进行排序。

到目前为止我已经知道了：

@inherits Umbraco.Web.Mvc.UmbracoTemplatePage
@{
var blogitems = Umbraco.Content("1102").Children.Where("Visible");
<ul>
@foreach(var blog in blogitems) {
    var tagsplit = blog.blogCats.Split(',');
    var usedTags=new List<string>();
    foreach(var tag in tagsplit) {

        //Output the first 5 items, then create a new <ul> and then list the rest

        if(!usedTags.Contains(tag)){
            <li>                    
                    <a href="/blog/?@tag">@tag</a>
            </li>
        }
        usedTags.Add(tag);
    }
}
</ul>
 }

我希望它有意义？

最终想要的输出应该类似于：

<ul>
                <li>
                    <a href="#" class="sort-item">Cat1</a>
                </li>
                <li>
                    <a href="#" class="sort-item">Cat2</a>
                </li>
                <li>
                    <a href="#" class="sort-item">Cat3</a>
                </li>
                <li>
                    <a href="#" class="sort-item">Cat4</a>
                </li>
                <li>
                    <a href="#" class="sort-item">Cat5</a>
                </li>
                <li>
                    <a href="#" class="sort-item dropdown-toggle" data-toggle="dropdown">More <b class="caret"></b></a>
                    <ul class="dropdown-menu">
                        <li>
                            <a href="portfolio-1-col.html">Cat6</a>
                        </li>
                        <li>
                            <a href="portfolio-2-col.html">Cat7</a>
                        </li>
                        <li>
                            <a href="portfolio-3-col.html">Cat8</a>
                        </li>
                    </ul>
                </li>
            </ul>

Answer 1

您的代码应如下所示：

@using System.Linq
@using System.Data.Linq
@inherits Umbraco.Web.Mvc.UmbracoTemplatePage
@{
var blogitems = Umbraco.Content("1102").Children.Where("Visible");
<ul>
@foreach(var blog in blogitems) {
    var tagsplit = blog.blogCats.Split(',').ToList();
    var usedTags=new List<string>();
    foreach(var tag in tagsplit.Take(5)) {

        //Output the first 5 items, then create a new <ul> and then list the rest

        if(!usedTags.Contains(tag)){
            <li>                    
                    <a href="/blog/?@tag">@tag</a>
            </li>
        }
        usedTags.Add(tag);
    }


    <a href="#" class="sort-item dropdown-toggle" data-toggle="dropdown">More <b class="caret"></b></a>
    <ul class="dropdown-menu">
    foreach(var tag in tagsplit.Skip(5)) {

       if(!usedTags.Contains(tag)){
            <li>                    
                    <a href="/blog/?@tag">@tag</a>
            </li>
       }
       usedTags.Add(tag);

    }
    </ul>
}
</ul>

}

Answer 2

@using System.Linq
@using System.Xml.Linq
@inherits Umbraco.Web.Mvc.UmbracoTemplatePage
@{
    var blogitems = Umbraco.Content("1102").Children.Where("Visible");
    <ul>
        @foreach (var blog in blogitems)
        {
            var tagsplit = blog.blogCats.Split(',');
            var usedTags = new List<string>();

            var i = 1;
            foreach (var tag in tagsplit)
            {

                //Output the first 5 items, then create a new <ul> and then list the rest
                if (i <= 5)
                {

                    if (!usedTags.Contains(tag))
                    {
                        <li>
                            <a href="/blog/?@tag">@tag</a>
                        </li>
                    }
                    usedTags.Add(tag);

                }

                i += 1;
            }

            <li><a href="#" class="sort-item dropdown-toggle" data-toggle="dropdown">More <b class="caret"></b></a></li>
            <ul>

                @{
                    i = 1;
                    foreach (var tag in tagsplit)
                    {
                        if (i > 5)
                        {

                            if (!usedTags.Contains(tag))
                            {
                                <li>
                                    <a href="/blog/?@tag">@tag</a>
                                </li>
                            }
                            usedTags.Add(tag);


                        }

                        i += 1;
                    }
                }
            </ul>
        }
    </ul>

遍历前 5 个项目，然后创建 ul 并列出其余项目

Loop through first 5 items, then create ul and list the rest

c#

razor

umbraco