Angular 消息的 js 在初始化时显示错误

Question

在我的项目中，我有 angularjs 1.5.10 和 ng-messages 1.5.10。我以简单的形式使用它：

<form class="form-horizontal" ng-submit="createBooking()" role="form" name="createBookingForm" novalidate>
    <div class="form-group">
                            <label for="payment_details_last_name" class="col-sm-3 control-label">Last name</label>
                            <div class="col-sm-6">
                                <input type="text"
                                       id="payment_details_last_name"
                                       name="payment_details_last_name"
                                       class="form-control"
                                       ng-model="payment_details.last_name"
                                       ng-required="true"
                                       ng-maxlength="30" />
                                <div ng-messages="createBookingForm.payment_details_last_name.$error" role="alert">
                                    <div ng-message="required">This field is required</div>
                                    <div ng-message="maxlength">Your field is too long</div>
                                </div>
                            </div>
                            <div class="col-sm-3"></div>
                        </div>
</form>

在控制器中：

$scope.members = [{
      'first_name': '',
      'last_name': '',
      'email': '',
      'phone_number': '',
      'date_of_birth': '',
    }];

而且一开始我总是看到错误 This field is required。我试图在控制器中创建空对象：

$scope.createBookingForm = {};

初始化后我也显示表格<div ng-if="initialized">

没有任何效果。使用 angular-seed 框架的项目

我看到了像 if $touched else 这样的肮脏黑客，但我想了解哪里出了问题...

Answer 1

没什么问题，请查看 official guide 中的示例。他们默认显示 required 错误。乍一看似乎不对，但这是唯一正确的处理方式。

所以基本上，ng-messages 完全按照文档所说的进行操作：

ngMessages is a directive that is designed to show and hide messages based on the state of a key/value object that it listens on.

该指令实时工作并显示当前输入状态的错误，这是有道理的。因此，如果您不希望默认显示任何消息，您应该使用一些已讨论过数百次的方法

How to make ngMessage for required fields only show when dirty or submitting a form?

AngularJS: Hiding ng-message until hitting the form-submit button

如果您需要其他一些改进的行为 - 目前没有快速的解决方案，您必须想出适合您需要的自己的验证引擎。

Angular 消息的 js 在初始化时显示错误

Angular js ng messages show error on init

angularjs

ng-messages