在命名表单上使用 ng-model 时获取 [Object object]答案

【问题标题】：Getting [Object object] when using ng-model on a named form在命名表单上使用 ng-model 时获取 [Object object]
【发布时间】：2014-07-23 21:56:47
【问题描述】：

如果我有以下情况：

<form
    id="registration"
    name="registration"
    method="POST"
>

    <input
        type="text"
        name="first_name"
        id="first-name"
        ng-model="registration.first_name"
        placeholder="First name"
    />

当我的表单显示时，如上配置的字段最终会在其中包含 [Object object] 作为初始值。

我在这里做错了什么以及在表单内进行双向绑定的正确方法是什么？

【问题讨论】：

标签： forms angularjs data-binding

【解决方案1】：

如果你没有在 ng-controller 中注册控制器，你可以从表单中删除 name="registration"，因为控制器已经初始化了表单，我尝试并工作。

plnkr.co/edit/JK3utpe1eERrJeoveaCQ?p=preview

【讨论】：

【解决方案2】：

Angularjs 表单在表单字段中加载时显示 [object Object]

我猜，它会显示这个错误，只有当你的表单名称和 ng-model 名称（值）相同时

like

 <form name="userform">-------
 <input ng-model="userform.firstname">

将您的表单名称或您的 ng-model 值更改为 user 或一些 xyz

【讨论】：

【解决方案3】：

我猜要么注册范围没有初始化，要么registration.first_name是一个对象。

看看这个 plunker：http://plnkr.co/edit/bdbs0XVB8hZSodOTYyM4?p=preview

在控制器中或使用 ng-init ng-init="registration = {}" 初始化注册模型

如果registration.first_name 是一个对象，那么它将显示为[Object object]。您必须为 ng-model 提供适当的字符串值作为模型

【讨论】：

您不应该以这种方式初始化模型对象。问题与基于<form name="registration"> 属性的作用域上的registration 已被使用这一事实有关。看看我回答中的演示，看看这是真的。

【解决方案4】：

在表单上设置name 属性会创建一个范围对象，该对象是useful for validation，但不打算用于输入的ng-model 属性。

如果您为 ng-model 使用单独的范围变量，它将按您的预期工作：

<form
    ...
    name="reg"
    ...
>

<input
    ...
    ng-model="registration.first_name"
    ...
/>

Demo

【讨论】：

您是否知道通过 Angular 资源获取表单值以执行提交的首选方法是什么？