Javascript 为什么我的表单不使用ngModelGroup填充数据？

我有一个下面的表单，其中我使用

ngModelGroup

对输入进行分组

<form #form="ngForm" (ngSubmit)="submit(form.value)">
    <fieldset ngModelGroup="user">
        <div>
            <label>Firstname:</label>
            <input type="text" name="firstname" [(ngModel)]="firstname">
        </div>
        <div>
            <label>Lastname:</label>
            <input type="text" name="lastname" [(ngModel)]="lastname">
        </div>
    </fieldset>
    <fieldset ngModelGroup="address">
        <div>
            <label>Street:</label>
            <input type="text" name="street" [(ngModel)]="street">
        </div>
        <div>
            <label>Zip:</label>
            <input type="text" name="zip" [(ngModel)]="zip">
        </div>
        <div>
            <label>City:</label>
            <input type="text" name="city" [(ngModel)]="city">
        </div>
    </fieldset>

    <button type="submit">Submit</button>
</form>

名字：
姓氏：
街道：
邮编：
城市：
提交

当我映射我的

[（ngModel）]=“user.firstname”或“user.lastname”或“user.address.street”

它能工作吗？如果我以上述方式这样做，我看不出我总共需要

ngModelGroup

的原因

我不知道如何正确地将

ngModelGroup

用于

嵌套对象。

以下是PRUNKR：

---

ngModelGroup

允许您通过引入“子属性”来塑造从表单接收的数据

使用模板中的

ngModelGroup=“user”

，以下是

表单的内容。值将类似于：

{
“用户”：{
“firstname”：“foo”，
“lastname”：“bar”
},
// ...
}

如果模板中没有
ngModelGroup=“user”，
表单。值将为：

{
“firstname”：“foo”，
“lastname”：“bar”，
// ...
}

ngModelGroup
有助于使表单数据具有与数据模型相同的形状。但是它对绑定到的属性没有影响（这些属性可以是您想要的任何属性）