Blazor 将 html 绑定到文本区域

Question

这看起来很简单，但我一直没能找到答案。在我的 Blazor 服务器端程序中，我有一个弹出式电子邮件表单，我预先填充了文本，然后用户可以编辑它并单击发送以让程序发送电子邮件。如果用户在 textarea 中输入换行符，他们会以 \n 返回，这很好。但是我一直无法将文本发送到带有换行符的文本区域。

在弹出表单中我有：

        <div class="form-group-sm">
            <label class="control-label">Message</label>
            <textarea rows="4" @bind="EmailMessage" class="form-control"></textarea>
        </div>

如果我发送

EmailMessage = "Test Email text \nline two <br /> line 3";

我明白了

如果我发送

EmailMessage = Markdown.ToHtml("Test Email text \nline two <br /> line 3");

我明白了

是否可以将换行符发送到绑定到属性的文本区域，然后用户可以编辑并将文本发送回程序？

理想情况下，这适用于任何 html 标记，但现在我将接受换行符。

Answer 1

这是基本的...您可以通过多种方式对其进行扩充：

@page "/"

<div class="form-group-sm">
    <label class="control-label">Message</label>
    <textarea rows="4" value="@EmailMessage" @onchange="@((args) => EmailMessage = args.Value.ToString())" class="form-control"></textarea>
</div>

<button @onclick="@(()=>{})">Refresh</button>



@code {
    private string emailMessage = "Test Email text \r\nline two \r\n line 3";
    
    public string EmailMessage
    {
        get =>  emailMessage;
        set
        {
            if (emailMessage != value)
            {
                emailMessage = ((MarkupString)value).ToString();
            }
        }

    }
 
}

Blazor 将 html 绑定到文本区域

Blazor bind html to textarea

html

textarea

bind

blazor