html - 使用 Blazor 的表内的 RadioButton

Question

首先，我正在使用Blazor WebAssembly 3.2.0 Preview 4.

我有一个名为 ObjectList 的对象列表，每个对象都有一个名为principal. 此列表填充一个表。

逻辑是列表中只有一个元素可以将principal属性值设置为 true，因此这就是单选按钮非常理想的原因。

在此示例中，我使用 MatBlazor 作为控件库。

有没有办法将此属性的单选按钮放在表格中，如下面的代码所示？

<table class="table table-condensed">
    <thead>
        <tr>
            <th>Object</th>
            <th>Principal</th>
        </tr>
    </thead>
    <tbody>
    @foreach (var object in ObjectList)
    {
        <tr>
            <td>@object .name</td>
            <td>
                <MatRadioButton TValue="bool" Value="@object.principal"></MatRadioButton>
            </td>
        </tr>
    }
    </tbody>
  </table>

Answer 1

MatRadioButton 按钮位于 MatRadioGroup 内部：

    <MatRadioGroup @bind-Value="@Val1" TValue="string">
        <MatRadioButton Value="@string.Empty" TValue="string">Default</MatRadioButton>
        <MatRadioButton Value="@("f")" Label="Female" TValue="string"></MatRadioButton>
        <MatRadioButton Value="@("m")" TValue="string">Male</MatRadioButton>
        <MatRadioButton Value="@("d")" Disabled="true" TValue="string">Disabled</MatRadioButton>
    </MatRadioGroup>
    @code
    {

        protected string Val1;
    }

MatRadioButton 文档

所以在你的情况下，它可能是这样的：

<MatRadioGroup @bind-Value="@object.principal" TValue="bool">   
   <MatRadioButton Value="true" TValue="bool">True</MatRadioButton>
   <MatRadioButton Value="false" TValue="bool">False</MatRadioButton>
</MatRadioGroup>

我在这里分享这个也是因为我需要类似的东西，而且周围没有很多很好的答案。