生成 HTML DOM 元素并将其插入 Razor 页面

Question

I currently am working on a asp.net MVC web application in which I have to generate a more or less complex HTML structure and then insert it into a Razor Page. 目前，我生成带有字符串连接的 HTML，然后将字符串添加到我的 controller 中的 ViewBag 中，如下所示：

public class SomeController : Controller
{
    public IActionResult Index()
    {
        string htmlString = "<div id=\"example-div\">Some more Stuff</div>" + "Some more HTML strings";
        Viewbag.htmlString = htmlString;
            
        return View();
    }
}

然后我访问该字符串并将其渲染到我的 Razor 页面内的 HTML 中，如下所示：

@Html.Raw(ViewBag.htmlString)

但这不是最佳实践。 有没有更好的方法在我的 controller 中实际生成 HTML DOM 元素，然后像模板一样将该元素加载到 razor 页面中？ 如果有怎么办？

谢谢

Answer 1

在这里，您可以创建自己的自定义扩展助手。

• 创建 static class

• 创建 static 方法

• 在 web.config 视图文件夹中注册命名空间，以便在所有页面中进行全局访问

1. 创建一个 class

public static class HtmlHelpers   
{   
     public static MvcHtmlString RenderTemplate(this HtmlHelper helper, string moreHtml=default(string))   
     {   
        MvcHtmlString ohtml = null;
        StringBuilder builder=new StringBuilder();
        builder.Append("<div id=\"example-div\">");
        builder.Append("Some more Stuff");
        builder.Append(moreHtml);
        builder.Append("</div>");
        ohtml =new MvcHtmlString(builder.ToString());
        
        return ohtml;
     }  
 } 

2. 在namespaces属性内的 web.config 中注册您的 class 命名空间

<add namespace="YOURNAMESPACE"/>

3. 打开任何 cshtml 页面并尝试输入此关键字。

@Html.RenderTemplate() // Default template
@Html.RenderTemplate("<span>More stuff</span>") // Customized template