在Angular中提交后无法清除表单字段

时间:2017-08-11 16:05:46

标签: html angularjs forms

我是棱角分明的新人。我在提交后查找了很多关于清除表单字段的答案,但似乎都没有。 这是我的HTML代码:

  <form name="myForm" ng-submit="formSubmit()" class="form-horizontal">

      <div class="form-group">

       <input type="text" class="form-control" ng-model="user.FullName" placeholder="Full Name" required=""/>

      </div>
      <div class="form-group">
      <input type="text" class="form-control" ng-model="user.Address" placeholder="Address" required=""/>
         </div>
     <button type="submit" class="btn btn-primary" style="background-color: purple;">Submit</button>

 </form>

这是我的JS代码:

 var myApp = angular.module('myApp', ['ui.router']); 
 myApp.controller("RegisterCtrl", function ($window,$scope,$http) {
   $scope.user={}
   $scope.formSubmit=function(){
     $http({
        method:'POST',
        url:'myurl',
        data:$scope.user,
        headers:{'Content-Type':'application/json'}
    }).then(function(res){
            console.log(res);
             $scope.myForm.$setPristine(); 
             $scope.myForm.$setPristine(true); 
             $scope.myForm='';      


      })
     }
  });

我已尝试过setPristine以及setUntouched但没有工作。

2 个答案:

答案 0 :(得分:1)

我的代码中没有看到任何奇怪的内容,我根据您的代码制作了plnkr,我所做的修改如下。还把plnkr sample

<强> CONTROLLER

var myApp = angular.module('myApp', ['ui.router']); 
 myApp.controller("RegisterCtrl", function ($window,$scope,$http) {
   $scope.user={}
   $scope.formSubmit=function(){
     $http({
        method:'POST',
        url:'myurl',
        data:$scope.user,
        headers:{'Content-Type':'application/json'}
    }).then(function(res){
        $scope.myForm.$setPristine();
        $scope.user = {};
      }, function(rej){ //error});
 }
 });

答案 1 :(得分:1)

你应该试试

var myApp = angular.module('myApp', ['ui.router']); 
 myApp.controller("RegisterCtrl", function ($window,$scope,$http) {
   $scope.user={}
   $scope.formSubmit=function(){
     $http({
        method:'POST',
        url:'myurl',
        data:$scope.user,
        headers:{'Content-Type':'application/json'}
    }).then(function(res){
        $scope.$broadcast('show-errors-reset');
        $scope.forms.user = {};
        $scope.forms.userFrom.$setPristine = true;
      }, function(rej){ //error});
 }
 });