如何在Blazor页面中正确展示带换行格式的XML内容？

问题原因 #

你当前的方案失效有两个核心原因：

• Blazor默认会对字符串输出做HTML转义处理，你写的<、>、<br>都会被转义为纯文本字符，不会被浏览器识别为格式标签。
• 如果你直接绕过转义输出原始XML，浏览器会把<Employee>这类XML标签识别为未知HTML元素，直接隐藏不显示，仅展示标签内的文本内容，无法呈现XML结构。

推荐解决方法 #

方案1：用<pre><code>标签展示格式化XML（最省心，无需手动加<br>）

<pre>标签会自动保留字符串里的换行和缩进，你不需要手动插入<br>标签，只要提前转义XML的特殊字符即可：

<pre>
  <code>
    @EncodedXMLSchema
  </code>
</pre>

@code {
    using System.Web;

    // 用逐字字符串定义XML，直接写换行和缩进即可，无需拼接
    private string XMLSchema = @"<?xml version='1.0'?>
<Employees>
    <Employee>
        <FirstName>First</FirstName>
        <LastName>Second</LastName>
        <ContactNo>1234567890</ContactNo>
        <Email>email@xyz.com</Email>
        <Address>
            <City>City</City>
            <Street>Street</Street>
            <StreetNr>1</StreetNr>
            <HouseNr>1</HouseNr>
            <Zip>01123</Zip>
        </Address>
    </Employee>
</Employees>";

    private string EncodedXMLSchema => HttpUtility.HtmlEncode(XMLSchema);
}

方案2：无需额外定义变量，直接在页面处理输出

如果你不想单独定义转义后的字段，可以直接在输出位置做 inline 处理：

<div>
    @((MarkupString)HttpUtility.HtmlEncode(XMLSchema).Replace("\n", "<br/>").Replace("  ", "&nbsp;&nbsp;"))
</div>

这段代码会先转义XML的尖括号，再把换行替换为<br/>、空格替换为 保留缩进，最后转成MarkupString让浏览器识别格式标签。

补充提示 #

你原来的XML存在语法错误：根节点开头写的是<Employee>，闭合标签是</Employees>，需要把开头改成<Employees>才能保证XML结构合法。

内容的提问来源于stack exchange，提问作者Mariusz