C#MVC网站中的面包屑使用Bootstrap

Question

我想在我的网站上添加面包屑,但我不太清楚如何去做.我已经能够使用以下代码获得基本工作:

<ol class="breadcrumb">
    <li class="active">
        @Html.ActionLink("Home", "Index", "Home")
        @if (ViewContext.RouteData.Values["controller"] != "Home" && ViewContext.RouteData.Values["action"] != "Index")
        {
            @:> @Html.ActionLink(ViewContext.RouteData.Values["controller"].ToString(), "Index", ViewContext.RouteData.Values["controller"].ToString())
        }

        > @ViewBag.SubTitle
    </li>
</ol>

我遇到的问题是,这实际上并没有跟踪你的历史,它只是告诉你

Home > ControllerName > CurrentItem

例如

Home > Members > Greg Dodd

当您来自会员搜索页面时,这种方法很有效,但是如果您来自不同的页面,则会丢失该历史记录.如何使用MVC中的History创建痕迹痕迹？

我想我正在寻找的是:

Home > Controller1 > PreviousItem > ... > CurrentItem

例如,如果你打开一个博客,然后是一个特定的博客项目,然后点击作者名称,你的面包屑应该是:

Home > Blog > SomeBlogTitle > AuthorName

但是,如果您打开了作者列表然后选择了特定作者,则会看到使用相同控制器渲染的相同视图,但是面包屑应该显示:

Home > Authors > AuthorName

Answer 1

我创建了一个OSS项目来解决自己的问题.我需要更多动态控制面包屑中的标签:

https://www.nuget.org/packages/MvcBreadCrumbs

或者,在这里贡献:

https://github.com/thelarz/MvcBreadCrumbs

Answer 2

安装后通过nuget:

PM> Install-Package MvcSiteMapProvider

然后你可以把这一行放在你的布局中:

@Html.MvcSiteMap().Menu(false, true, true)

您也可以自定义它以从数据库中获取数据,首先您需要创建一个派生自DynamicNodeProviderBase以下类的类:

   public class PostDetailsDynamicNodeProvider : DynamicNodeProviderBase
    {
        private readonly IPostService _postService;

        public PostDetailsDynamicNodeProvider()
        {
            _postService = new PostService(new MyDbContext());
        }

        public override IEnumerable<DynamicNode> GetDynamicNodeCollection()
        {
            var returnValue = new List<DynamicNode>();

            foreach (var post in _postService.GetSiteMapData(20))
            {
                var node = new DynamicNode
                {
                    Title = post.Title,
                    Controller = "Post",
                    Action = "Index",
                    Area = "",
                    LastModifiedDate = post.ModifiedDate

                };
                node.RouteValues.Add("id", post.Id);
                node.RouteValues.Add("title", node.Title);
                returnValue.Add(node);
            }

            // Return 
            return returnValue;
        }
    }

GetSiteMapData:

public IList<SiteMapModel> GetSiteMapData(int count)
        {
            return _posts.AsNoTracking().OrderByDescending(post => post.CreatedDate).Take(count).
                          Select(post => new SiteMapModel
                              {
                                  Id = post.Id,
                                  CreatedDate = post.CreatedDate,
                                  ModifiedDate = post.ModifiedDate,
                                  Title = post.Title
                              }).ToList();
        }

然后更改项目中的MvcSiteMap文件:

<?xml version="1.0" encoding="utf-8" ?>
<mvcSiteMap xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
            xmlns="http://mvcsitemap.codeplex.com/schemas/MvcSiteMap-File-3.0"
            xsi:schemaLocation="http://mvcsitemap.codeplex.com/schemas/MvcSiteMap-File-3.0 MvcSiteMapSchema.xsd"
            enableLocalization="true">
  <mvcSiteMapNode title="">
    <mvcSiteMapNode clickable="true"  title="" dynamicNodeProvider="yourCustomClassNamespace" />
  </mvcSiteMapNode>
</mvcSiteMap>

Answer 3

如果您想要一个简单的解决方案,您可以使用此代码.它仅用于默认路由配置.

主页/控制器/页面

  @if (ViewContext.RouteData.Values["controller"].ToString().ToLower() != "home")
  {
       <ol class="breadcrumb">
             <li>
              @Html.ActionLink("Home", "Index", "Home")
             </li>
             <li> @Html.ActionLink(ViewContext.RouteData.Values["controller"].ToString(), "Index")
             </li>                                
             <li class="active"> @Html.ActionLink(ViewContext.RouteData.Values["action"].ToString(), ViewContext.RouteData.Values["action"].ToString())
             </li>                                                       
        </ol>
   }