使用带有Angularjs客户端表单验证的Rails表单时出现字段名称问题答案

【问题标题】：issue with fields names when using Rails form with Angularjs client side form validation使用带有Angularjs客户端表单验证的Rails表单时出现字段名称问题
【发布时间】：2013-08-19 11:36:51
【问题描述】：

我正在尝试在我的 Rails 项目中使用 Angularjs 进行客户端表单验证。我正在使用内置的 ng-show 指令来显示表单字段的错误。代码很简单：

<%= form_for(resource, :as => resource_name, :url => registration_path(resource_name), 
                              html: { novalidate: true, name: 'signUpForm'}) do |f| %>
  ...

  <%= f.email_field :email, :'ng-model'=>'user.email', name: 'uEmail', 
                              autofocus: true, required: true %>
  ...

  <div ng-show="signUpForm.uEmail.$dirty && signUpForm.uEmail.$invalid">
    <span ng-show="signUpForm.uEmail.$error.required">
      <small class="error">Tell us your email.</small>
    </span>
    <span ng-show="signUpForm.uEmail.$error.email">
      <small class="error">This is not a valid email.</small>
    </span>
  </div>
<% end %>

这给了我一个很好的客户端验证，但问题是，因为 Rails 默认提供一个表单字段名称，如 model[attr] 在我的例子中为 user[email]

但是，在这里我给我的电子邮件字段命名为uEmail，提交表单后的 post 请求中的参数将是 uEmail: 'xxx@xx.xx'，rails 无法理解（默认情况下，Rails 期望类似 user: { email: 'xxx@xx.xx' ... }）

我尝试删除 name: 'uEmail' 并回退到 Rails 默认 user[email] 并在 ng-show 指令中使用类似的东西

<span ng-show="signUpForm.user[email].$error.required">

但这不起作用，有人知道如何解决这个问题吗？

btw: rails -v 4.0 Angularjs version: 1.0.7

【问题讨论】：

标签： ruby-on-rails angularjs client-side-validation form-fields

【解决方案1】：

我不知道你是否找到了这个问题的解决方案，我也遇到了同样的问题，我发现一个问题已经在 GitHub 上打开了：

https://github.com/angular/angular.js/issues/1201

解决方案非常简单，在您的情况下，您只需这样做：

<span ng-show="signUpForm['user[email]'].$error.required">

【讨论】：