Question

是否可以将HTML代码附加到现有的剃刀部分？

以下是我的情景：

我的_layout.cshtml包含以下内容：

@RenderSection("BottomSection", required: false)

在其中一个视图_article.cshtml中，我已经定义了如下所示的部分：

@section BottomSection
{
 <script src='~/Scripts/module/article_details.js' type='text/javascript'></script>
 <script src='~/Scripts/module/modal.js' type='text/javascript'></script>
 @MvcHtmlString.Create(Model.ExtraStuff)   
}

并在名为_counter.cshtml的部分视图中，由上面的视图使用;我想在同一部分添加更多HTML代码，即BottomSection。

我尝试在局部视图中再次声明BottomSection部分：

@section BottomSection{
<text>More data</text>
}

但它没有成功。

有没有办法实现这一点 - 动态地将更多代码附加到MVC 4中已定义的剃刀部分？请注意，部分视图不需要来自父视图/模型的任何数据。我正在使用MVC 4和.Net Framework 4.0 / VS2010。

Answer 1

我不知道如何将内容添加到各个部分（实际上我想知道自己），但我知道一个可能产生类似结果的技巧。可以使用TempData而不是使用部分。 TempData与ViewBag非常相似，但是一旦设置了一个变量，它就会在那里为当前用户生存，直到再次尝试访问它（它可以为当前用户提供一些连续的请求，因此建议格外小心）。以下是如何使用它的示例。

布局：

@Html.Raw(new MvcHtmlString((string)TempData["BottomSection"]));

在视图中：

@{
    var bottomSection = (string)TempData["BottomSection"];
    if (bottomSection == null)
    {
        bottomSection = "";
    }
    bottomSection += "<script src='~/Scripts/module/article_details.js' type='text/javascript'></script>\n";
    bottomSection += "<script src='~/Scripts/module/modal.js' type='text/javascript'></script>\n";
    bottomSection += Model.ExtraStuff + "\n";
    TempData["BottomSection"] = bottomSection;
}

在局部视图中：

@{
    var bottomSection = (string)TempData["BottomSection"];
    if (bottomSection == null)
    {
        bottomSection = "";
    }
    bottomSection += "More data";
    TempData["BottomSection"] = bottomSection;
}

这可以通过为这些伪部分和\编写辅助函数来进一步改进，或者通过将部分的内容移动到单独的部分（见下文）来进一步改进。

bottomSection += Html.Partial("_StuffToAddToSection").ToString();

助手类：

public static class PseudoSectionsHelper
{
    public static MvcHtmlString AppendToPseudoSection<T>(this TempDataDictionary TempData, string sectionName, T model, Func<T, HelperResult> content, bool addNewLineCharacter = true)
        where T : class
    {
        return AppendToPseudoSection(TempData, sectionName, content(model).ToString(), addNewLineCharacter);
    }

    public static MvcHtmlString AppendToPseudoSection(this TempDataDictionary TempData, string sectionName, MvcHtmlString content, bool addNewLineCharacter = true)
    {
        return AppendToPseudoSection(TempData, sectionName, content.ToString(), addNewLineCharacter);
    }

    public static MvcHtmlString AppendToPseudoSection(this TempDataDictionary TempData, string sectionName, string content, bool addNewLineCharacter = true)
    {
        var section = (string)TempData[sectionName];
        if (section == null)
        {
            section = "";
        }
        else if (addNewLineCharacter)
        {
            section += "\n";
        }
        section += content;
        TempData[sectionName] = section;
        // We return empty MvcHtmlString to be able to use this helper inline (without declaring code block @{ some code... } in view)
        return new MvcHtmlString("");
    }

    public static MvcHtmlString PseudoSection(this TempDataDictionary TempData, string sectionName)
    {
        var section = (string)TempData[sectionName];
        return new MvcHtmlString(section);
    }
}

使用示例

在布局中添加：

@TempData.PseudoSection("BottomSection")

在视图中：

@TempData.AppendToPseudoSection("BottomSection", Model, @<text>
    <script src='~/Scripts/module/article_details.js' type='text/javascript'></script>
    <script src='~/Scripts/module/modal.js' type='text/javascript'></script>
    @MvcHtmlString.Create(Model.ExtraStuff)
</text>)

或

@{
    TempData.AppendToPseudoSection("BottomSection", Model, @<text>
        <script src='~/Scripts/module/article_details.js' type='text/javascript'></script>
        <script src='~/Scripts/module/modal.js' type='text/javascript'></script>
        @MvcHtmlString.Create(Model.ExtraStuff)
    </text>);
}

甚至

@TempData.AppendToPseudoSection("BottomSection", Html.Partial("BottomSectionScriptsAndStuff"))

部分：

@TempData.AppendToPseudoSection("BottomSection", "More data")

Answer 2

也许我不明白你的问题，但为什么你不使用嵌套的部分视图???

例如：

PartialView1

`<script src='~/Scripts/module/article_details.js' type='text/javascript'></script>  
 <script src='~/Scripts/module/modal.js' type='text/javascript'></script>  
 @MvcHtmlString.Create(Model.ExtraStuff)
 @{Html.RenderPartial("PartialView2",Model.ExtraStuff );}`

PartialView2

`<text>More data</text>`

Answer 3

使用Ajax，您可以加载局部视图，并可以在目标部门中进行渲染。

尝试使用jquery ajax

      $.ajax({
            type: 'GET',
            url: '@Url.Action("Action","Controller")',
            cache: false,
            timeout: 20000,
            contentType: "application/json; charset=utf-8",
            success: function (_results) {
                $("#TargetDiv").html(_results);
            },
            error: function (_results) {

            }
        });

将HTML代码附加到现有Razor部分

3 个答案: