How to make a HTML text multiline using a C# bind in a blazor project?

The only way I can think of is using Razor templates. \r\n, Envirnoment.Newline, and anything else cannot make the compiler budge.

Here is a working solution using Razor Template:

<p>@resultString</p>

@code {
    RenderFragment resultString =  @<p>Series not found <br />Error message</p>;

}

Update: You can also use this:

MarkupString  resultString = (MarkupString) $"Series not found <br />Error message"; 

Update 2: From the documents:

Render raw HTML Blazor normally renders strings using DOM text nodes, which means that any markup they may contain will be ignored and treated as literal text. This new feature lets you render special MarkupString values that will be parsed as HTML or SVG and then inserted into the DOM.

WARNING: Rendering raw HTML constructed from any untrusted source is a major security risk!

Use the MarkupString type to add blocks of static HTML content.

@((MarkupString)myMarkup)

@functions {
    string myMarkup = "<p class='markup'>This is a <em>markup string</em>.</p>";
}

Hope this helps...


I don't think it's a good idea to render the raw html tag because it is so dangerous most of the time.

As for your question, I would suggest you should add one line CSS code to display the line breaking:

<p style="white-space: pre-line" >@resultString</p>

@code {
    string resultString = "Series not found \nError message";
}

Demo

enter image description here