在 ASP.NET MVC 架构中实现模型时出现问题

Question

给您一些背景信息。

我一直在尝试使用 razor 页面创建一个简单的 ASP.NET MVC 应用程序。

现在我已经了解了视图模型的概念以及如何使用它们在 Razor 页面中显示数据。

事情是..现在我想使用 Razor 页面来创建彼此相关的值。

让我更深入地研究一下。现在我有 2 个班级：

Personas

（人）和

Hijos

（儿童）。这个想法很简单。

人们可以有很多孩子，但孩子只是一个父母的孩子，在这个角色中。

我创建了一个显示和另一个页面，显示该人的儿子，这一切都已说完。

问题是当我尝试创建一个子级并将其连接到父级时。

这些是相关课程：

public class Persona
{
    public int Id { get; set; }
    public string Nombre { get; set; } = null!;
    public string Apellido { get; set; } = null!;
    public string Email { get; set; } = null!;
    public string Telefono { get; set; } = null!;
    
    //Hijo
    public List<Hijo>? Hijos { get; set; }
}

public class Hijo
{
    public int Id { get; set; }
    public string Nombre { get; set; }
    public DateOnly FechaNacimiento { get; set; } = DateOnly.FromDateTime(DateTime.Now);
    
    //Navigation Properties
    public int PersonaId { get; set; }
    public Persona Persona { get; set; } = null!;
}

我创建了一个如下所示的视图模型：

public class CrearHijoViewModel
{
    public string Nombre { get; set; }

    public DateOnly FechaNacimiento { get; set; }
    
    public List<Persona> Padres { get; set; }
}

它基本上保存将在创建视图中显示的数据。

这是控制器：

[HttpPost]
public async Task<IActionResult> Create(Hijo hijo)
{
    Console.WriteLine(hijo);

    if (ModelState.IsValid)
    {
        _context.Add(hijo);
        await  _context.SaveChangesAsync();
        return RedirectToAction(nameof(Index));
    }

    var padres = await _context.Personas.ToListAsync();

    var newCrearHijoModel = new CrearHijoViewModel
        {
            Nombre = hijo.Nombre,
            FechaNacimiento = hijo.FechaNacimiento,
            Padres = padres
        };

    return View(newCrearHijoModel);
}

这是表格：

<form asp-controller="Hijos" asp-action="Create" method="post">
    <div>
        <label>Nombre</label>
        <input type="text" asp-for="Nombre">
    </div>
    <div>
        <label>Fecha de Nacimiento</label>
        <input type="date" asp-for="FechaNacimiento">
    </div>
    <select class="form-control" asp-for="Padres">
        @foreach (var padre in Model.Padres)
        {
            <option value="@padre.Id">@padre.Nombre @padre.Apellido</option> 
        }
    </select>
    <input type="submit" value="Crear Hijo">
</form>

正如你所看到的，这是一个相当简单的..想法。我不确定我的实施情况。

当我尝试提交数据时出现问题。它被拒绝了。我不确定是否是因为我收到的是

Hijo

模型，而 Razor 页面处理的是

CrearHijoViewModel

。

我知道这可能是一个问题，但如果是......我该如何解决它？ 我应该创建一个新的

Hijo

对象并将其输入到上下文中吗？是我的视图模型还是我的 Razor 页面错误？

非常感谢任何帮助或指导！

Answer 1

我们面临的问题是由模型绑定造成的。在 Post 方法中，我们准备好接收

Hijo

，但在表单中，我们发布

Nombre Padres

，它与

Hijo

中定义的属性不匹配。该问题有 2 种方法，1 更改我们的控制器操作以接收

CrearHijoViewModel

，2 更改我们的表单以提交

Hijo

。

但是如果我们想使用方法2，我们不能使用像

asp-for="Padres"

这样的标签帮助器，因为它绑定到View的模型，即

CrearHijoViewModel

。我们可以使用类似于下面的表单来提交 Hijo，从此我们不需要更改控制器操作。

<form asp-controller="Hijos" asp-action="Create" method="post">
    <div>
        <label>Nombre</label>
        <input type="text" asp-for="Nombre">
        @* asp-for="Nombre" will help generate element attribute id="Nombre" name="Nombre" *@
        @* since Model Hijos has property Nombre too, we can still use asp-for="Nombre" *@
    </div>
    <div>
        <lable>Persona Nombre </lable>
        <input type="text" name="Persona.Nombre">
    </div>
    <div>
        <lable>Persona Email </lable>
        <input type="text" name="Persona.Email">
    </div>
    <input type="submit" value="create child">
</form>