2

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 %>

model[attr]これにより、クライアント側の検証がうまくいきますが、問題は、Rails がデフォルトで私の場合のようにフォーム フィールド名を与えるためです。user[email]

ただし、ここではuEmail、フォームを送信した後、ポストリクエストでメールフィールドに名前とパラメーターを付けますuEmail: 'xxx@xx.xx'。これは、レールが理解できないものです(デフォルトでは、レールは次のようなものを期待しています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

4

1 に答える 1