项目常见错误及解决方法-angular表单验证清除$dirty样式问题

本文解决了一个Angular项目中表单验证的问题。在多次添加条目并重置表单时,$dirty状态导致验证提示无法正常隐藏。通过调用$setPristine()和$setUntouched()方法解决了该问题。
摘要由CSDN通过智能技术生成

最近,公司angular项目,使用到了angular自身的表单验证,我是用了其自身验证,具体场景是 增加一个条目,在表单中验证是否符合条件,增加成功后,再次增加,重置表单,重复上述过程。但是遇到一个问题,就是在添加一次后,每一次重新添加,将表单清空。按道理此时,$dirty是不应该起作用的,但是还是会有不提示。

<div class="form-group">
							<label class="col-sm-2 control-label"><i class="data-need">*</i>排序</label>
      						<div class="col-sm-10">
      							<input type="number" ng-model="menu.index" class="form-control" ng-required="true" name="menuClass">
      							<div class="alert alert-danger help-block" ng-show="menuForm.menuClass.$dirty && menuForm.menuClass.$invalid">
									请填写菜单排序
								</div>
      						</div>
						</div>

$dirty自身的样式,就会仍然起作用:


用户体验很差。后经过查询资料,知道是$dirty的样式仍然在起作用。

使用

$scope.menuForm.$setPristine();
			$scope.menuForm.$setUntouched();

来清除,即可达到目的。具体的工作原理,本人再去详细查下

评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值