显示验证错误不会在角度|中起作用$ errors对象为空

时间:2015-10-07 18:02:56

标签: ruby-on-rails angularjs validation

我有以下表格(在铁轨中)

= form_for([@debate,@argument], html: { class: "form-horizontal", role: "form" , "ng-submit"=>"addArgument('support',$event)", novalidate: true, name: "argumentformsupport"}) do |f|
  - if @argument.errors.any?
    .alert.alert-danger.alert-dismissable role="alert"
      button.close type="button" data-dismiss="alert"
        span aria-hidden="true"
          | ×
        span.sr-only
          | Close
      h4= "#{pluralize(@argument.errors.count,"error")} prohibited this argument from being saved:"
      ul
        - @argument.errors.full_messages.each do |msg|
          li= msg
  = f.hidden_field :side, :value=>side, "ng-model"=>"argument['support'].side"

  .form-group

    .col-sm-12
      = f.text_area :content, class: "form-control", "ng-model"=>"argument['support'].content", required: true, "ng-minlength"=>"100", "ng-maxlength"=>"4000"
      textarea.form-control ng-model="argument['support'].content" name="content" required=true ng-minlength="100" ng-maxlength=4000
      <div ng-messages="argumentformsupport.content.$error" style="color:maroon" role="alert">
        <div ng-message="required">Please type the argument</div>
        <div ng-message="minlength">Your field is too short</div>
        <div ng-message="maxlength">Your field is too long</div>
      </div>

  .form-group
    .col-sm-4
      = f.submit class: "btn btn-success"
    .col-sm-3
      button.btn.btn-danger type="button" ng-click="debcon.toggleArgumentForm('support')" Cancel

以下是我的app js代码

var debateApp=angular.module("debate",['ng-rails-csrf', 'yaru22.angular-timeago'])

debateApp.controller("DebateController",["$scope","$http",function($scope,$http){
....
}

ng-messages根本不起作用。所有消息都是可见的。我添加了angular-messages依赖,但所有消息仍然可见。

我还检查了argumentformsupport.content。$ errors对象。它空了

2 个答案:

答案 0 :(得分:4)

您的主模块缺少ngMessages依赖项。看起来应该是这样的:

angular.module("debate",['ngMessages', 'ng-rails-csrf', 'yaru22.angular-timeago'])

当然,您还需要包含正确的javascript文件。

请参阅:https://docs.angularjs.org/api/ngMessages;

答案 1 :(得分:0)

首先,您是否在模块依赖项数组中添加了ngMessages?

angular.module("debate",['ngMessages', 'ng-rails-csrf', 'yaru22.angular-timeago'])

其次,我建议您在ng-messages div中使用$ dirty(以检查用户是否已经与表单进行了交互)。它看起来像:

      <div ng-messages="argumentformsupport.content.$error" ng-show="argumentformsupport.content.$dirty" style="color:maroon" role="alert">