0

我需要在表单顶部显示所有消息，并且需要为电子邮件和电话号码等字段实现自定义错误。

索引.html

<form name="adminForm" ng-submit="addAdmin()" novalidate>

所有错误信息都需要在这里显示

<div class="form-group" ng-class="{ 'has-error': adminForm.firstName.$touched && adminForm.firstName.$invalid }">
    <label>First Name</label>
    <input type="text" name="firstName" class="form-control" ng-model="admin.first_name" ng-maxlength="255" required>

    <div class="help-block" ng-messages="adminForm.firstName.$error" ng-if="adminForm.firstName.$touched">
        <div ng-messages-include="messages.html"></div>
    </div>

</div>

<div class="form-group" ng-class="{ 'has-error': adminForm.lastName.$touched && adminForm.lastName.$invalid }">
    <label>Last Name</label>
    <input type="text" name="lastName" class="form-control" ng-model="admin.last_name" ng-maxlength="255" required>

    <div class="help-block" ng-messages="adminForm.lastName.$error" ng-if="adminForm.lastName.$touched">
        <div ng-messages-include="messages.html"></div>
    </div>

</div>

<div class="form-group" ng-class="{ 'has-error': adminForm.email.$touched && adminForm.email.$invalid }">
    <label>Email</label>
    <input type="email" name="email" class="form-control" ng-model="admin.email" ng-maxlength="255" required>

    <div class="help-block" ng-messages="adminForm.email.$error" ng-if="adminForm.email.$touched">
        <div ng-messages-include="messages.html"></div>
    </div>

</div>

消息.html

<p ng-message="required">This field is required</p>
<p ng-message="minlength">This field is too short</p>
<p ng-message="maxlength">This field is too long</p>
<p ng-message="email">This needs to be a valid email</p>
<p ng-message="pattern">This needs to be a valid number</p>
<p ng-message="equals">Password must be same</p>

我正在寻找任何可能的解决方案或对其他可能解决方案的参考。

原因：我在为此（菜鸟）实施单元测试时发现困难，所以我认为单个错误消息可以使测试变得容易。谢谢！

4

0 回答 0