anglejsのフォームでデータをクリアまたはリセットするにはどうすればよいですか？

Question

は、角度と$ setPristine機能を使用してフォームデータを消去する方法を見つけてきたが、まだ何の結果はいつも私に$のsetPristineは関数ではありませんというエラーを与えません。誰かが親切に私の解決策を手伝ってくれますか？

ここに私のangular.controllerが

$scope.AddCustomer = function() { 

      var CustDetails = { 
       cname: $scope.CusDetails.cname, 
       comname: $scope.CusDetails.comname, 
       tel: $scope.CusDetails.tel, 
       email: $scope.CusDetails.email 

      };   

      CustService.Customer(CustDetails, function (res) { 
       console.log(res); 

       $.extend($.gritter.options, { 
        position: 'bottom-right', 
       }); 

       if (res.data == 'success') { 
        $.gritter.add({ 

         title: 'Success!', 
         text: 'Successfully added the new customer ' + '<h4><span class="label label-primary">' + CustDetails.cname + '</span></h4>', 
         time: '5000', 
         close_icon: 'l-arrows-remove s16', 
         icon: 'glyphicon glyphicon-ok-circle', 
         class_name: 'success-notice' 
        }); 

        //CustDetails = {}; 

        customerForm.$setPristine(true); 
       } 
       else { 
        $.gritter.add({ 
         title: 'Failed!', 
         text: 'Failed to add a new customer', 
         time: '5000', 
         close_icon: 'l-arrows-remove s16', 
         icon: 'glyphicon glyphicon-remove-circle', 
         class_name: 'error-notice' 
        }); 
       } 


      });   
     } 

だ。ここのHTMLコードを

だ

<div ng-controller="AddCustomerController"> 
    <div class="page-content-wrapper"> 
     <div class="page-content-inner"> 
      <div id="page-header" class="clearfix"> 
       <div class="page-header"> 
        <h2>Add Customer</h2> 
        <span class="txt">Create and add new customer.</span> 
       </div> 
      </div> 

      <!--Start .row--> 
      <div class="row"> 
       <div class="col-md-1"> 
       </div> 

       <div class="col-lg-9 col-sm-9 col-xs-12"> 
        <!--col-lg-9 starts here--> 
        <div class="panel panel-default toggle panelMove panelClose panelRefresh"> 
         <div class="panel-heading"> 
          <h4 class="panel-title">Customer Details</h4> 
         </div> 
         <div class="panel-body pt0 pb0"> 
          <form class="form-horizontal group-border stripped" id="customerForm"> 
           <div class="form-group"> 
            <label class="col-lg-2 col-md-3 control-label">Customer Name</label> 
            <div class="col-lg-10 col-md-9"> 
             <input type="text" required id="cname" ng-model="CusDetails.cname" class="form-control" name="cname" /> 
            </div> 
           </div> 
           <!--end of .form-group--> 
           <div class="form-group"> 
            <label class="col-lg-2 col-md-3 control-label">Company Name</label> 
            <div class="col-lg-10 col-md-9"> 
             <input type="text" required id="comname" ng-model="CusDetails.comname" class="form-control" name="comname" /> 
            </div> 
           </div> 
           <!--end of .form-group--> 
           <div class="form-group"> 
            <label class="col-lg-2 col-md-3 control-label" for="">Telephone Number</label> 
            <div class="col-lg-10 col-md-9"> 
             <div class="input-group input-icon"> 
              <span class="input-group-addon"><i class="fa fa-phone s16"></i></span> 
              <input ng-model="CusDetails.tel" class="form-control" id="ctel" type="text" placeholder="(999) 999-9999"> 
             </div> 
            </div> 
           </div> 
           <!-- End .form-group --> 
           <div class="form-group"> 
            <label class="col-lg-2 col-md-3 control-label" for="">Email address</label> 
            <div class="col-lg-10 col-md-9"> 
             <input id="email" ng-model="CusDetails.email" type="text" class="form-control" name="placeholder" placeholder="someone@example.com"> 
            </div> 
           </div> 
           <!-- End .form-group --> 
          </form> 
         </div> 
        </div> 
        <!--End .panel--> 
       </div> 
       <!--.col-9 ends here--> 
      </div> 
      <!--End .row--> 
      <!--Start .row--> 
      <div class="row"> 
       <div class="col-md-1"></div> 
       <div class="col-lg-9 col-sm-9 col-xs-12"> 
        <button id="btnSubmit" type="submit" ng-click="AddCustomer()" class="btn btn-info pad"><span class="fa fa-user-plus"></span> Add Customer</button> 
        <button type="submit" class="btn btn-default pad">Cancel</button> 
       </div> 
      </div> 
     </diV> 
    </div> 
</div> 

Answer 1

になりますあなたは

あなたのコード

var CustDetails = { 
       cname: $scope.CusDetails.cname, 
       comname: $scope.CusDetails.comname, 
       tel: $scope.CusDetails.tel, 
       email: $scope.CusDetails.email 

      }; 

のようにNG-モデルの値を除去することにより、フォームフィールドの値を削除することができます

この

と交換

$scope.CustDetails = { 
       cname: $scope.CusDetails.cname, 
       comname: $scope.CusDetails.comname, 
       tel: $scope.CusDetails.tel, 
       email: $scope.CusDetails.email 

      }; 

あなたのコード

customerForm.$setPristine(true); 

あなたは以下のコードでフォームを設定することができ、この

$scope.CustDetails={}; 

Answer 2

使用

$scope.customerForm.$setPristine(true); 

フォームに

name= "CusDetails" 

のような名前を付けます

、それは問題を解決します。

Answer 3

使用：

$scope.$destroy 

それが親スコープに関連付けられているすべての子を削除し、それに関連するすべてのデータが消去されますよう。

Answer 4

1. idの代わりに attrを使用してください。 name="forName"
2. コントローラ内部のフォームの参照が$scope.formName

Answer 5

と交換してください：

$scope.customerForm.$setPristine(); 
$scope.customerForm.$setUntouched(); 
$scope.CustDetails={};