从Spark迁移到Razor

Question

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

我的Spark master中的行调用了一个子视图

<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部分.

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

我如何将这两个绑在一起？

所以我的层次结构如下

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>

    }