如何在Orchard Content List中的`li`中添加一个类？

Question

我正在使用Orchard 1.8，创建了一个新主题，并尝试将博客文章列表实现为Bootstrap List Group。这是Bootstrap List Group所需的标记。我们需要为ul和每个li添加一个类。

<ul class="list-group">
  <li class="list-group-item">Cras justo odio</li>
  <li class="list-group-item">Dapibus ac facilisis in</li>
  <li class="list-group-item">Morbi leo risus</li>
  <li class="list-group-item">Porta ac consectetur ac</li>
  <li class="list-group-item">Vestibulum at eros</li>
</ul>

我被困在实施的第三步。

1. 将Bootstrap添加到布局。完成。
2. 将list-group类添加到Parts_Blogs_BlogPost_List形状的ul。完成。
3. 为每个list-group-item添加li课程。没完成。

如何为每个list-group-item添加li课程？

将Bootstrap添加到布局中。完成。



将list-group类添加到Parts_Blogs_BlogPost_List形状的ul。完成。



在进行实现时，我使用Shape Tracing确定我需要修改Parts_Blogs_BlogPost_List形状及其Parts.Blogs.BlogPost.List.cshtml模板，以将list-group类添加到ul元件。但是，我们如何为每个list-group-item元素添加li？

Answer 1

在Parts.Blogs.BlogPost.List.cshtml模板中，添加以下代码行：

Model.ContentItems.ItemClasses.Add("list-group-item");

完成的Bootstrap List Group模板如下所示：

@{
    IEnumerable<object> blogPosts = Model.ContentItems;
    Model.ContentItems.Classes.Add("content-items");
    Model.ContentItems.Classes.Add("blog-posts");
    Model.ContentItems.Classes.Add("list-group");
    Model.ContentItems.ItemClasses.Add("list-group-item");
}

@Display(Model.ContentItems)

@if (blogPosts == null || blogPosts.Count() < 1) {
    <p>@T("There are no posts for this blog.")</p>
}

您可以通过Shape Tracing＆gt;自行研究。型号：