text-files - 在我的 Blazor 服务器端应用程序中，我逐行读取文本文件。但是当我可视化 Razor 页面中的线条时，线条缩进没有显示。为什么？

Question

我是 Blazor 服务器端应用程序的 razor.cs，我逐行读取错误日志文本文件。在日志文件中，存在使用行缩进编写的 .NET 异常，以便更好地概览。但是，当我在 Razor 页面中可视化日志文件内容时，没有显示行缩进，为什么？我可以做什么来显示带有原始行缩进的行？

我的 razor.cs 页面

 public List<string> Error_log = new List<string>() { };
 public void Read_Logfile
 {
   Encoding.RegisterProvider(CodePagesEncodingProvider.Instance);
   var lines = File.ReadLines(CommonClass.error_path, Encoding.GetEncoding("Windows-1254"));
   var line_trimmed = "";

   foreach (var line in lines)
   {
     TagService.Error_log.Add(line);
   }
 }

我的 Razor 页面

<table>
    @for (int f = 0; f < TagService.Error_log.Count; f++)
    {
        <tr>
            <td class="sys_config_file">@TagService.Error_log[f]</td>
        </tr>
    }
</table>

Answer 1

您遇到的 Razor 页面中未显示行缩进的问题可能与 HTML 渲染和空白处理有关。默认情况下，HTML 将连续的空白字符折叠成单个空格。

要在呈现的 HTML 中保留文本文件中的行缩进，您可以使用 <pre>标记或应用 CSS 样式来保留空白。以下是如何修改 Razor 页面以保留行缩进的示例:

<style>
    .preformatted {
        white-space: pre;
    }
</style>

<table>
    @for (int f = 0; f < TagService.Error_log.Count; f++)
    {
        <tr>
            <td class="sys_config_file"><pre class="preformatted">@TagService.Error_log[f]</pre></td>
        </tr>
    }
</table>

在此示例中，我们添加了一个名为 .preformatted 的 CSS 类。并将其应用到 <pre> <td> 内的标签元素。 white-space: pre; CSS 属性保留原始文本中的行缩进和其他空白字符。

或者，您可以使用 <pre>直接标记，无需 CSS 样式:

<table>
    @for (int f = 0; f < TagService.Error_log.Count; f++)
    {
        <tr>
            <td class="sys_config_file"><pre>@TagService.Error_log[f]</pre></td>
        </tr>
    }
</table>

通过使用<pre>标记时，行缩进和空白字符将按原样保留在呈现的 HTML 输出中，从而保持文本文件的原始格式。