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