Blazor验证子组件列表

Question

我正在尝试在Blazor中实现ObjectGraphDataAnnotationsValidator，并使用子组件列表。一个Animal列表绑定在表单上，通过for循环进行渲染。Child类的其中一个属性是Required。 以下是代码：

Test.razor

@using System.ComponentModel.DataAnnotations
@page  "/Test"
@code {
    public class MyClass
    {
        public MyClass()
        {
            Animals = new List<AnimalItem>();
        }
        [Required]
        public string FormName { get; set; }
        public IList<AnimalItem> Animals { get; set; }
    }

    public class AnimalItem
    {
        [Required]
        public string Name { get; set; }
    }

    protected override async Task OnInitializedAsync()
    {
        MyFormData = new MyClass()
        {
            Animals = new List<AnimalItem>()
            {
                new AnimalItem { Name = "Fuffy" },
                new AnimalItem { Name = "Flaffy" }
            }
        };
        await base.OnInitializedAsync();
    }

    public MyClass MyFormData { get; set; }

    private void OnValidSubmit()
    {
    }
}

<EditForm Model="MyFormData" OnValidSubmit="@OnValidSubmit" >
    <ObjectGraphDataAnnotationsValidator />
    <ValidationSummary /> 
    <InputText type="text" @bind-Value="MyFormData.FormName"/>
    @foreach (var animal in MyFormData.Animals)
    {
        <Animal AnimalItem="animal"></Animal>
    }
    <button type="submit">Post</button>
</EditForm>

这是我的组件： Animal.razor

@code {
    [Parameter]
    public Test.AnimalItem AnimalItem { get; set; }
}
<label for="Animal">Animal</label>
<InputText  id="Animal" type="text" @bind-Value="@AnimalItem.Name" />

当我编辑组件列表并清空名称字段时，表单会正确地提示我需要填写名称属性。然而，这并不能阻止我在按下提交按钮后保存它。 我做错了什么？欢迎提供关于如何调试Blazor验证的任何建议 :) 谢谢

- ab_732

---

您无需在当前示例中实现ObjectGraphDataAnnotationsValidator。 - enet

@enet 抱歉我错过了你的评论。你是什么意思？如果没有ObjectGraphDataAnnotationsValidator，只有顶层会被验证。 - ab_732

我的意思是，你的代码永远不会起作用。 - enet

Answer 1

我认为你可能需要在MyClass上的Animals集合中添加[ValidateComplexType]。

    public class MyClass
    {
        public MyClass()
        {
            Animals = new List<AnimalItem>();
        }
        [Required]
        public string FormName { get; set; }
        [ValidateComplexType]
        public IList<AnimalItem> Animals { get; set; }
    }   

MS Docs复杂类型部分

- MrC aka Shaun Curtis

---

我把答案修改了，因为属性需要放在集合属性上。非常感谢你指引我找到解决方案！ - ab_732

没问题。 :-) - MrC aka Shaun Curtis