Question

我们正在逐步迁移基于Spark的项目以使用Razor，我遇到了一些我似乎找不到答案的东西。

我的Spark大师中的一行调用了一个子视图，如此

<Sidebar>   
    <segment name="header"> 
        <div> <!-- header content--> </div>
    </segment>
    <segment name="content"> 
        <div> <!-- content content--> </div>
    </segment>
</Sidebar>

侧边栏的火花看起来像这样

<div id="sidebar" >
<div class="header">
    <render segment="header">
        <!-- placeholder -->
    </render>
</div>
<div class="ui-layout-content content">
    <render segment="content">
        <!-- placeholder -->
    </render>   
</div>

这将使用第二部分中布局中显示的第一部分内容进行渲染。有没有什么方法可以使用Razor重新创建它。我可以看到我需要使用Partials，但我看不到如何将内容传递到侧边栏子视图中。

基本上我正在尝试重新创建Spark调用Segments（或之前的Sections）http://sparkviewengine.com/reference/elements#segmentpreviouslyknownassection

的功能

编辑：更多信息。我有一个Index.cshtml从Application.cshtml获取它的布局。在这里，我有标记代码进入Sidebar.cshtml部分。

如果我在我的Index.cshtml文件中添加put @section header（在Sidebar.cshtml中呈现），则它不会将其识别为有效部分。我的Sidebar.cshtml文件中有@RenderSection("header", false)。

如何将这两者结合在一起？

所以我的层次结构如下

Application.cshtml - 全局页面布局
Index.cshtml - 包含侧边栏内容的页面布局
Sidebar.cshtml - 来自Index.cshtml的侧边栏内容的模板/ layoout

例如

在Index.cshtml中

    @RenderPage("Sidebar") 
    @section SidebarHeader { <!--Title or something --> }
    @section SidebarContent { <!--Content --> }

然后在Sidebar.cshtml中

    <div class="header">
        @RenderSection("SidebarHeader", false)
    </div>
    <div class="ui-layout-content content">
        @RenderSection("SidebarContent", false)
    </div>

我的想法是，我可以在一个子视图中有一个模板，该子视图中填充了视图中的内容。这意味着我可以为整个站点的其他页面模板区域。例如。另一页上的侧边栏内容需要相同的格式，但内容不同。

Answer 1

您可以使用布局和部分来完成相同的操作。详情请见http://weblogs.asp.net/scottgu/archive/2010/12/30/asp-net-mvc-3-layouts-and-sections-with-razor.aspx

Index.cshtml：

@RenderSection("Sidebar")

您的sidebar.cshtml看起来像这样：

<div id="sidebar" >
    <div class="header">
        @RenderSection("header", required: false)
    </div>
    <div class="ui-layout-content content">
        @RenderSection("content", required: false)  
    </div>
</div>

和这样的子视图（你可以将它们定义在一起，但从长远来看它们可能更好）：

SubViews.cshtml：

    @section header {
      <div> <!-- header content--> </div>

    }

    @section content {
      <div> <!-- content content--> </div>

    }

Answer 2

我能看到让我按照自己的意愿工作的唯一方法如下。

创建一个类来表示子视图中的内容

例如

public class Sidebar
{
    public string Title { get; set; }
    public IHtmlString Contents { get; set; }
}

然后在_viewstart.cshtml

Func<Sidebar, HelperResult> sidebarHelper =
    @<div class="sidebar">
        <div>@item.Title</div>
        <div>
            @item.Contents
        </div>
    </div>;
ViewContext.Controller.ViewData["SidebarTemplate"] = sidebarHelper ;

然后在我的Index.cshtml

的顶部

var sidebarTemplate = ViewContext.Controller.ViewData["SidebarTemplate"] as Func<Sidebar, HelperResult>;

我可以进一步打电话给

@{ 
    var sidebarContents= new StringBuilder(); 
    foreach(var x in y)
    {
        sidebarContents.append("<div>Some Potentially Long nasty HTML STRING" + x.Something + "</div>");
    }
}
@sidebarTemplate (new Sidebar()
{ 
    Title = "title",
    Contents = Html.Raw(sidebarContents.ToString())
})

我真的不喜欢我必须在代码中声明HTML，因为它可能是一个长字符串。技术上认为这确实解决了这个问题。如果有人有任何更好的想法，或者如果我不清楚自己，请发表评论！感谢。

从Spark迁移到Razor

2 个答案: