提交表单后,我一直在努力重置表单。有人在这里发布了此文件,我想使其正常运行,但没有成功。这是我的代码示例。
$scope.form.$setPristine();
没有设置Pristine: {{user_form.$pristine}}
为true。请参阅上面的示例。
Answers:
$ setPristine()是在angularjs的1.1.x分支中引入的。您需要使用该版本而不是1.0.7才能运行。
有一个类似的问题,我不得不将表单设置回原始状态,但又保持原状,因为$ invalid和$ error都用于显示错误消息。仅使用setPristine()不足以清除错误消息。
我通过使用setPristine()和setUntouched()解决了它。(请参阅Angular的文档:https : //docs.angularjs.org/api/ng/type/ngModel.NgModelController)
因此,在我的控制器中,我使用了:
$scope.form.setPristine();
$scope.form.setUntouched();
这两个函数将完整的表单重置为$ pristine并恢复为$ untouched,以便清除所有错误消息。
对于那些不想$setPristine
升级到v1.1.x的用户,这里是我用来模拟该$setPristine
功能的功能。我不愿意使用v1.1.5,因为我使用的AngularUI组件之一不兼容。
var setPristine = function(form) {
if (form.$setPristine) {//only supported from v1.1.x
form.$setPristine();
} else {
/*
*Underscore looping form properties, you can use for loop too like:
*for(var i in form){
* var input = form[i]; ...
*/
_.each(form, function (input) {
if (input.$dirty) {
input.$dirty = false;
}
});
}
};
请注意,它只能使$dirty
字段整洁,并有助于更改“显示错误”条件,例如$scope.myForm.myField.$dirty && $scope.myForm.myField.$invalid
。
表单对象的其他部分(如css类)仍然需要考虑,但这解决了我的问题:隐藏错误消息。
还有另一种原始形式的方法,就是将表单发送到控制器中。例如:-
鉴于:-
<form name="myForm" ng-submit="addUser(myForm)" novalidate>
<input type="text" ng-mode="user.name"/>
<span style="color:red" ng-show="myForm.name.$dirty && myForm.name.$invalid">
<span ng-show="myForm.name.$error.required">Name is required.</span>
</span>
<button ng-disabled="myForm.$invalid">Add User</button>
</form>
在控制器中:
$scope.addUser = function(myForm) {
myForm.$setPristine();
};
过去,DavidLn的回答对我来说效果很好。但是它没有捕获setPristine的所有功能,这次让我大跌眼镜。这是一个更完整的垫片:
var form_set_pristine = function(form){
// 2013-12-20 DF TODO: remove this function on Angular 1.1.x+ upgrade
// function is included natively
if(form.$setPristine){
form.$setPristine();
} else {
form.$pristine = true;
form.$dirty = false;
angular.forEach(form, function (input, key) {
if (input.$pristine)
input.$pristine = true;
if (input.$dirty) {
input.$dirty = false;
}
});
}
};