在Angular中单击按钮时清除输入字段

时间:2018-04-24 07:09:33

标签: html angularjs angularjs-ng-click

我知道这是一个常见问题,但我在这方面遇到了问题。按钮单击时,我无法通过输入字段刷新。

当我点击按钮时,信息将被发送并添加到列表中。因此,每当我单击它时,输入字段必须清除/刷新(而不是页面加载)。

查看:

<div class="input-group">
        <span class="input-group-addon" id="reg_input">Name</span>
         <input type="text" class="form-control" placeholder="Name" ng-model="ff.Name" required>
</div>

<div class="input-group">   
    <span class="input-group-addon" id="reg_input">Block</span>
     <input class="form-control" id="bl" type="text" ng-model="ff.Block" required>
</div>

<div class="input-group">   
    <input type="text" class="form-control" id="ip" type="text" ng-model="ff.IP" ng-maxlength="2" style="width: 30px" required>
</div>
   <a class="btn btn-md btn-primary" ng-click="getClick(ff)">Add</a>

是否在bootstrap按钮中预定义了刷新?

EDIT控制器: -

$scope.list = {};
                $scope.array_of_Names = [];
              $scope.getClick= function() {
                 $scope.master = angular.copy($scope.ff);
                  $http.post("url", $scope.list).success(function(data) { 
                        $scope.AllData= data;
                        $scope.addInfo.Segments.push($scope.list);
                        $scope.ff.Name = "";
                        $scope.ff.Block= "";
                        $scope.ff.IP= "";
                        $scope.array_of_Names.push($scope.list);
                       console.log("Segment successfully created");

                  },function (data, status, headers, config) { 
                       // growl.error("Something went wrong");
                  });
                     console.log($scope.master);
                };

3 个答案:

答案 0 :(得分:2)

试试吧! $ scope.ff下的所有属性都将被重置。

$scope.ff={};

您可以将它应用于您的代码部分:

$scope.list = {};
            $scope.array_of_Names = [];
          $scope.getClick= function() {
             $scope.master = angular.copy($scope.ff);
              $http.post("url", $scope.list).success(function(data) { 
                    $scope.ff={};
                    $scope.AllData= data;
                    $scope.addInfo.Segments.push($scope.list);
                    $scope.array_of_Names.push($scope.list);
                   console.log("Segment successfully created");

              },function (data, status, headers, config) { 
                   // growl.error("Something went wrong");
              });
                 console.log($scope.master);
            };

答案 1 :(得分:1)

编辑:

$scope.getClick= function() {
    $scope.master = angular.copy($scope.ff);
    $scope.ff = {};
    $http.post("url", $scope.list).success(function(data) { 
           $scope.AllData= data;
           $scope.addInfo.Segments.push($scope.list);
           $scope.array_of_Names.push($scope.list);
           console.log("Segment successfully created");
        },function (data, status, headers, config) { 
          // growl.error("Something went wrong");
        }).error(function(err) {
            console.log("Error: ", err);
        });
        console.log($scope.master);
 };

答案 2 :(得分:0)

尝试使用then代替success

$scope.getClick = function(ff){
  $scope.master = angular.copy($scope.ff);
              $http.post("url", $scope.list).then(function(data) { 
                    $scope.AllData= data;
                    $scope.addInfo.Segments.push($scope.list);
                    $scope.ff.Name = "";
                    $scope.ff.Block= "";
                    $scope.ff.IP= "";
                    $scope.array_of_Names.push($scope.list);
                   console.log("Segment successfully created");

              },function (data, status, headers, config) { 
                   // growl.error("Something went wrong");
              });
                 console.log($scope.master);
}