Blazor中如何为HTML元素注入无键值对的属性字符串？

你遇到的问题是Blazor对HTML布尔属性（比如selected、disabled这类不需要值的属性）的渲染规则导致的，直接用字符串拼接输出空值的写法不会生效，Blazor有专门的布尔属性绑定语法来解决这个问题。

正确的简化写法 #

针对selected属性，你可以直接绑定布尔表达式：

<InputSelect>
    @foreach (var kvp in ListOfValues)
    {
        <option selected="@(kvp.Key == SelectedValue)" value="@kvp.Key">
            @kvp.Value
        </option>
    }
</InputSelect>

Blazor的渲染逻辑会自动处理：

• 当kvp.Key == SelectedValue为true时，渲染出<option selected value="xxx">
• 当表达式为false时，完全省略selected属性，不会生成多余的空属性

扩展到多属性场景 #

如果需要同时处理disabled、自定义class等属性，只需要添加对应的布尔绑定即可，不用再写分支代码：

<InputSelect>
    @foreach (var kvp in ListOfValues)
    {
        var isSelected = kvp.Key == SelectedValue;
        var isDisabled = kvp.Key == "禁用项的Key"; // 根据你的实际条件调整
        <option 
            selected="@isSelected" 
            disabled="@isDisabled" 
            value="@kvp.Key"
            class="@(isDisabled ? "text-gray-500" : "")"
        >
            @kvp.Value
        </option>
    }
</InputSelect>

补充说明 #

你提到的@bind-Value确实能简化选中状态的处理，但对于disabled这类需要动态控制的布尔属性，上面的布尔绑定写法依然是最通用的解决方案，能大幅减少重复代码，避免属性增多时的分支嵌套问题。

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