我有一个Angular Material设计表单,其中包含3个输入字段,其中包含 required
选项 . 单击提交按钮后,我无法将表单重置为默认状态 . 我正在使用 $setPristine
将表单更改为原始状态,但红色错误行在提交后出现 . 提交表单后有没有办法摆脱这些错误 .
谢谢 .
Codepen链接:http://codepen.io/sateesh2499/pen/pbkjVV
View:
<div ng-controller="AppCtrl" layout="column" ng-cloak="" class="inputdemoErrors" ng-app="MyApp">
<form name="careersForm">
<div class="careersContainer">
<md-content>
<div layout-gt-sm="row">
<md-input-container class="md-block" flex-gt-sm>
<label>Job Title</label>
<input type="text" name="jobTitle" ng-model="careers.jobTitle" required>
</md-input-container>
<md-input-container class="md-block" flex-gt-sm>
<label>Job Location</label>
<input type="text" name="jobLocation" ng-model="careers.jobLocation" required>
</md-input-container>
<md-input-container class="md-block" flex-gt-sm>
<label>Job Category</label>
<input type="text" name="jobCategory" ng-model="careers.jobCategory" required>
</md-input-container>
</div>
</md-content>
</div>
<div class="row text-center">
<div class="col-sm-12">
<md-button class="md-raised" style="width: 200px"
ng-click="postJob()">Submit</md-button>
</div>
</div>
</form>
Pristine: {{careersForm.$pristine}}
</div>
Controller:
angular.module('MyApp',['ngMaterial', 'ngMessages', 'material.svgAssetsCache'])
.controller('AppCtrl', function($scope) {
$scope.careers = {};
$scope.postJob = function(){
// after successful posting
$scope.careers = {};
$scope.careersForm.$setPristine();
}
});
1 回答
您可以在调用
$setPristine
后添加$scope.careersForm.$setUntouched();
来解决此问题 .无论如何,我认为你的代码应该工作......所以可能是一个bug .
希望能帮助到你