Blazor中如何将字符串类型布尔值绑定到Checkbox？

问题场景 #

需要将值为"True"或"False"的字符串类型字段绑定到Blazor的InputCheckbox组件，尝试两种方法均失败：

方法一：手动指定Value和ValueChanged #

<EditForm Model="@Wrapper" FormName="BlogSettings" OnValidSubmit="@SaveBlogSettingsAsync" style="width: 100%" novalidate>
<DataAnnotationsValidator />

    @foreach(var item in Wrapper.BlogSettings)
    {
        <div>
        @if (item.Value.ToLower().Contains("true") | item.Value.ToLower().Contains("false"))
        {
                <InputCheckbox Value=@(Convert.ToBoolean(item.Value)) ValueChanged=@((v) => item.Value = v.ToString()) Label="@(Enum.GetName(item.Setting))" />
            }
            else
            {
            <FluentTextField Label="@(Enum.GetName(item.Setting))" TextFieldType="@TextFieldType.Text" @bind-Value="item.Value" Style="width: 100%" />                    
            }
     </div>
        
    }
     <FluentButton Type="@ButtonType.Submit" Style="width: 100%;  margin-top: 2rem;" Appearance="Appearance.Accent">Save</FluentButton>

</EditForm>

报错信息：

InvalidOperationException: Microsoft.AspNetCore.Components.Forms.InputCheckbox requires a value for the 'ValueExpression' parameter. Normally this is provided automatically when using 'bind-Value'.

方法二：使用@bind-Value:get和@bind-Value:set #

<InputCheckbox @bind-Value:get="bool.Parse(item.Value)" @bind-Value:set="(val) => {item.Value = val.ToString();}" Label="@(Enum.GetName(item.Setting))" />

报错信息：

ArgumentException: The provided expression contains a MethodCallExpression1 which is not supported. FieldIdentifier only supports simple member accessors (fields, properties) of an object.

相关代码结构：
BlogSettings.razor.cs：

partial class BlogSettings
{
    [SupplyParameterFromForm(FormName = "BlogSettings")]
    public BlogSettingsWrapper Wrapper { get; set; } = new();

    [Inject]
    public ISettingsService SettingsService { get; set; }
    private async Task SaveBlogSettingsAsync()
    {
        await SettingsService.SaveSettingsAsync(Wrapper.BlogSettings);
    }

    protected override void OnInitialized()
    {
        Wrapper.BlogSettings = SettingsService.GetSettings().OrderBy(bs => bs.Setting).ToList();          
    }
    public class BlogSettingsWrapper
    {
        public ICollection<BlogSetting> BlogSettings { get; set; } = [];
    }
}

BlogSetting.cs：

public class BlogSetting : BaseEntity
{
    public Setting Setting { get; set; }
    public string Value { get; set; } = string.Empty;
    public string Description { get; set; } = string.Empty;
}

错误原因分析 #

1. 方法一错误原因：
   InputCheckbox组件需要ValueExpression参数跟踪绑定字段，用于表单验证和状态更新。手动指定Value和ValueChanged时未提供该参数，而@bind-Value语法会自动生成Value、ValueChanged、ValueExpression三个参数，因此触发缺失参数异常。

2. 方法二错误原因：
   Blazor绑定要求@bind-Value:get必须是简单成员访问（字段/属性），不支持直接调用方法（如bool.Parse）。框架无法将方法调用解析为有效FieldIdentifier，因此抛出表达式不支持异常。

可行的替代实现方式 #

最简洁的方案是给BlogSetting类添加计算属性，自动处理字符串与布尔值的转换，让绑定符合Blazor规则：

1. 修改BlogSetting类 #

public class BlogSetting : BaseEntity
{
    public Setting Setting { get; set; }
    public string Value { get; set; } = string.Empty;
    public string Description { get; set; } = string.Empty;

    // 布尔值计算属性，自动转换Value字段
    public bool IsBooleanValue
    {
        get => bool.TryParse(Value, out var result) ? result : false;
        set => Value = value.ToString();
    }
}

2. 更新Razor组件绑定代码 #

将InputCheckbox绑定改为直接使用新的计算属性：

@if (item.Value.ToLower() is "true" or "false")
{
    <InputCheckbox @bind-Value="item.IsBooleanValue" Label="@(Enum.GetName(item.Setting))" />
}
else
{
    <FluentTextField Label="@(Enum.GetName(item.Setting))" TextFieldType="@TextFieldType.Text" @bind-Value="item.Value" Style="width: 100%" />                    
}

方案优势 #

• 完全符合Blazor绑定规则，自动生成所需参数，避免异常。
• 转换逻辑封装在实体类内部，代码整洁且复用性强。
• 提交表单时，Value字段会自动同步布尔值的字符串表示，无需额外处理。

补充说明 #

若需处理无效布尔字符串（如非"True"/"False"的值），可在计算属性的get方法中添加默认值逻辑（如上述代码的false），或根据业务需求抛出异常、展示提示信息。

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