MatBlazor 选择问题答案

【问题标题】：MatBlazor select issueMatBlazor 选择问题
【发布时间】：2020-04-16 17:34:57
【问题描述】：

我的代码应该是这样的，但是它得到了空引用异常

 <MatSelect Label="Atık Tipi" @bind-Value="@SecilenAtikGrubu.GrupId" Style="width:100%">
      @foreach (var item in TumAtikTipleri)
     {
        <MatOption Value="@item.Id">@item.Deger1</MatOption>
     }
 </MatSelect>

但是当我这样使用时，它正在工作

  <select class="mdc-select__native-control" @bind="SecilenAtikGrubu.GrupId">
     @foreach (var item in TumAtikTipleri)
     {
         <option value="@item.Id">@item.Deger1</option>
     }
  </select>

绑定值类如下（SesilenAtikGrubu和TumAtikTipleri）

 public class GrupKodlari : KayitBilgisi
{
    [Key]
    public int Id { get; set; }
    public string Tur { get; set; }
    public string Isim { get; set; }
    public string Deger1 { get; set; }
    public string Deger2 { get; set; }
    public string Deger3 { get; set; }
    public int? GrupId { get; set; } 
    public virtual GrupKodlari Grup { get; set; }

}

【问题讨论】：

您确定没有一个GrupIDs 为空吗？我怀疑 MatSelect 不处理绑定到空值
是的，当 GrupId 不为空时它可以工作，但它应该与空值一起工作。
就像我说的，你并不真正知道 MatSelect 组件在幕后用值做什么。它可能不期望空值。我建议在他们的github 上打开一个问题
谢谢你，我会的。
查看 MudBlazor。它有一个很好的选择：mudblazor.com/components/select

标签： blazor blazor-server-side matblazor

【解决方案1】：

坏消息是，我已经检查过了，MatSelect 无法绑定到可为空的类型。

现在好消息，第一个，您可以使用辅助属性作为解决方法，Try it at blazorfiddle。

public int GrupIdAux
{
    set{
        GrupId = (value==0?(int?)null:value);
    }
    get {
        return (GrupId==null?0:GrupId.Value);
    }
}

第二个好消息：MatBlazor 是一个开源项目。如果您需要使用可空类型，请can improve MatSelect control 并发送 PR。项目所有者对贡献持开放态度（例如I wrote NumericUpDown）如果您无法改进组件，您可以花钱请人为您编写，或者您可以在项目问题上发布新功能的请求。看起来是个好主意，绑定可为空的对象会很棒。

【讨论】：

【解决方案2】：

@daniherrera 您可以将MatSelect 绑定到可为空的类型。但是，您必须使用? 指定您接受可空类型。示例：

<MatSelect Label="Pick a Food Group" @bind-Value="@guidValue">
    <MatOption TValue="Guid?" Value="@(null)"></MatOption>
    <MatOption TValue="Guid?" Value="@(new Guid("20A82054-F493-4C7B-81A4-4F9A1EDD7C2E"))">Bread, Cereal, Rice, and Pasta</MatOption>
    <MatOption TValue="Guid?" Value="@(new Guid("4451642D-24F7-418F-8741-BA5089A1CC65"))">Vegetables</MatOption>
    <MatOption TValue="Guid?" Value="@(new Guid("5717DBBE-C205-4E33-9E07-892A51F64021"))">Fruit</MatOption>
</MatSelect>

<span>@guidValue</span>

@code
{
    Guid? guidValue = new Guid("20A82054-F493-4C7B-81A4-4F9A1EDD7C2E");
}

https://www.matblazor.com/Select#MatSelectGuid

使用int? Id 并用TValue="int?" 标记您的MatOption。

【讨论】：

【解决方案3】：

我的解决方法是：

<MudSelect T="Genre?" Label="Genre Primary" @bind-Value="model.MainGenrePrimary" Variant="Variant.Outlined">
<MudSelectItem T="Genre?"></MudSelectItem>
@foreach (Genre item in Enum.GetValues(typeof(Genre)))
{
   <MudSelectItem T="Genre?" Value="@item">@item</MudSelectItem>
}
</MudSelect>

【讨论】：

您的答案可以通过额外的支持信息得到改进。请edit 添加更多详细信息，例如引用或文档，以便其他人可以确认您的答案是正确的。你可以找到更多关于如何写好答案的信息in the help center。