$error.required OR(原始和空值）上的角度必需消息

angular required message on $error.required OR (pristine AND empty value)

本文关键字：消息 空值 required error OR 原始      更新时间：2023-09-26

我已经搜索了一个解决方案，所以这是我对这个网站的第一个问题：

我正在尝试在角度(离子(页面中进行一些很好的验证，其中的逻辑是我想在标签下显示"Required"消息，当存在验证错误($error.required(或字段未被触及并且为空(如第一次加载(。 我可以使用原始来检查它是否未被修改，但是如果表单随后从模型中加载值(例如从localstorage恢复时(，它仍然显示" required "验证消息。

我尝试了以下方法：

<form name="wdform" novalidate>
<label class="item item-input item-stacked-label">
<span class="input-label green-small">ID</span>
<div class="validation" ng-show="wdform.userid.$error.required ||
(wdform.userid.$pristine && wdform.userid.length < 1)" >
  Required 
</div>
<input name="userid" ng-model="input.UserID" type="text" required>
</label> 
  ... rest of form...
</form>
还尝试过：

<div class="validation" ng-show="wdform.userid.$error.required ||
(wdform.userid.$pristine && input.UserID.length < 1)" >

以及各种其他排列，例如：

(wdform.userid.$pristine && input.UserID == '')
(wdform.userid.$pristine && wdform.userid.$invalid)
etc. ad nauseum.

在单独但相关的说明中，我还发现内置验证在表单和字段名称方面非常脆弱......它似乎只有在表单名称只有小写和/或不包含特殊字符时才有效("DumbForm"和"dumb-form"失败，但"smartform"有效(。

无论如何，有人有什么想法吗？

我觉得你的两个场景，(1($error.必需和(2(原始和空，可能是多余的。任何时候 #2 都是真的，#1 也是如此。我认为你可以只使用#1。

请看这个例子：http://plnkr.co/edit/PgQ3vEIOKkfA38dDWjhp?p=preview

<body ng-controller="myController as vm">
  <h1>Hello Plunker!</h1>
  <form name="wdform">
    <input type="text" name="userid" ng-model="userId" required/>
    <div ng-show="wdform.userid.$error.required">Required</div>
  </form>
</body>

但是，听起来您有时从 localStorage 在页面加载时填充表单，不知何故，这不会导致 $error.required 属性更改为 true，但它应该。所以我认为你真正的问题在于需要调用 $scope.$apply(( 或告诉 angular 再次运行验证的东西。

我发现问题与验证div的放置位置有关。

如果验证div 放在输入字段之前(以便它在字段标签下方显示验证消息(，我遇到了此问题中指定的错误。

通过将其放在输入标记之后，它可以按预期工作(在输入字段下方显示验证消息(。

我认为这是Angular或Ionic中的一个错误。 希望它将在即将推出的版本 2 中得到纠正。

<button type="button" class="close" data-dismiss="modal" aria-label="Close" (click)="f3.form.reset()">

只需在 button.so 表单中添加单击即可在 reset(( 中加载模型中的值。单击按钮表单将重置。您将获得没有错误的新表单。

相关文章：