Rails 中的 Angular 表单验证答案

【问题标题】：Angular Form Validation in RailsRails 中的 Angular 表单验证
【发布时间】：2014-10-24 04:43:52
【问题描述】：

在提交之前，我正在尝试在 Angular 中进行一些表单验证。我在表单中使用了 ng-submit，但无论我做什么，表单仍然提交......这是我目前拥有的：

导轨：

<%= form_tag("/createListing", "ng-submit" => "formvalidation($event)") do %>
    ... form contents in here
    <button ng-disabled="!agree_terms" value="Start" type="submit">Submit</button>
<% end %>

Javascript：

$scope.formvalidation = function() {
    var errors = validationService.dosomevalidation();

    if (errors.length === 0) {
        $event.target.submit();
    } else {
        $scope.errors = errors;
        return false;
    }
}

我的思考过程有点像 jQuery 或 vanilla javascript。任何想法为什么表单仍会提交？

提前致谢。

【问题讨论】：

不应该使用带有 Angular 的 Rails 模板。
我尝试不使用 form_tag，但没有成功。
@HappyCry 如果您想要在表单中点击提交后创建一个确认按钮，那么您应该使用指令来捕获提交事件并触发消息，看看这个：要点。 github.com/asafge/7430497 希望对您有所帮助

标签： javascript ruby-on-rails angularjs forms

【解决方案1】：

我的表单验证正确（使用 rails、angularjs、haml）：

%form.nuevaRecetaForm{:name => 'newRecipeForm', :novalidate => '', 'ng-submit' => 'form.submit(newRecipeForm.$valid)'}
  = text_field :recipe, :title, placeholder: 'Título', :required => '', 'ng-model' => 'recipeTitle'

不需要额外的 JS 来验证形式。您要验证的每个字段只需要在字段中指定规则，在我的情况下，该字段是必需的。然后在表单标签中使用属性 $valid ，如您在示例中看到的那样，并且 angular 为您进行验证！

您有任何问题，我很乐意回答以帮助您解决这个问题！

【讨论】：