1

情况:

我的 Angular 应用程序中有许多表单,我需要一个有效的错误消息系统。我发现ngMessages很有用。

但我希望只有当用户模糊某个字段时才会出现错误消息,以减少“攻击性”。

试图:

尝试在 1000 毫秒使用去抖动

<label class="item item-input">
    <span class="input-label"> Email alternative </span>
    <input type="email" name="email_alternative" ng-model="profile_edited.email2" ng-model-options="{ debounce: 1000 }">
</label>

<!-- Error messages for ALTERNATIVE EMAIL  -->
<label class="item item-input" ng-show="profile_edit_form.email_alternative.$error.email">
    <div class="form-errors" ng-messages="profile_edit_form.email_alternative.$error" role="alert" ng-if='profile_edit_form.email_alternative.$dirty'>
        <div class="form-error" ng-message="email">Your email address is invalid</div>
    </div>
</label>

这样,如果用户一秒钟内没有输入任何内容,它将正确显示错误消息。是我最接近我想要的东西。

但有时对于某些用户而言,键入字符 @ 可能需要超过 1 秒的时间。错误消息可能会突然出现并使用户感到困惑。

但是如果我将去抖动时间设置为 2 或 3 秒就太长了。当用户已经在另一个字段中写入时,它可能会出现。

我需要仅在用户模糊出字段后才会触发错误消息。

问题:

我如何在模糊时触发 ngMessages?

4

2 回答 2

7

$dirty如果输入框中的文本发生更改,将评估为 true。要检查模糊,您可以使用$touched输入字段的属性。

查看表单文档以查看所有表单(输入)属性:https ://docs.angularjs.org/guide/forms

于 2015-09-09T10:50:43.097 回答
0

当输入脏时,您可以使用$dirtyand来显示消息。ng-show

<input type="text" name="modelName" ng-model="modelName" required />
<div ng-messages="myForm.modelName.$error" ng-show="myForm.modelName.$dirty">
    <div ng-message="required">Please Fill this model.</div>
</div>
于 2016-12-11T06:44:21.100 回答