Javascript Como evitar múltiplas requisições ao servidor

Xandrules · 4 de setembro de 2019

Boa tarde, estou usando angularJS,
Usando a diretiva ng-click chamando uma função para persistir em memoria toda vez que altero o valor.
porém toda vez que altero o valor e enviado multiplas vezes ao servidor.

<div class="col-xs-12">
      <div id="calibration" ng-show="hide" class="col-xl-12">

        <div class="row justify-content-md-center">
          <div class="col-xl-3 col-md-4">
            <label>Cal Point</label>
            <select id="calpoint" class="form-control" offset="" ng-model="data[1].value" ng-click="this.disabled; this.value = 'saving' ;calChange(0)">
              <option value="0">P6-1</option>
              <option value="1">P6-2</option>
              <option value="2">P5-1</option>
              <option value="3">P5-2</option>
              <option value="4">P4-1</option>
              <option value="5">P4-2</option>
              <option value="6">P3-1</option>
              <option value="7">P3-2</option>
              <option value="8">P2-1</option>
              <option value="9">P2-2</option>
              <option value="10">P1-1</option>
              <option value="11">P1-2</option>
              <option value="12">P0-1</option>
            </select>
          </div>
          <div class="col-xl-3 col-md-4">
            <label>Cal Offset</label>
            <input id="caloffset" offset="" type="number" ng-model="data[2].value" value="0" step="0.01" ng-disabled="showCalOffset" class=" form-control rounded"
              ng-click="calChange(1)">
          </div>
          <div class="col-xl-3 col-md-4">
            <label>Scale</label>
            <input id="scaleoffset" offset="" type="number" ng-model="data[3].value" min="100" ng-disabled="showScaleActive" max="1000" value="0"
              class=" form-control rounded" ng-click="calChange(2)">
          </div>
          <div class="col-xl-3 col-md-4">
            <label>Algorithm</label>
            <select id="algorithm" offset="" ng-model="data[4].value" class="form-control" ng-click="calChange(3)">
              <option value="0">Memory</option>
              <option value="1">Memory Less</option>

            </select>
          </div>
          <div class="col-xl-4 col-md-4">
            <label></label>
            <button id="rundpd" type="button" class="form-control btn btn-primary" ng-disabled="showCalOffset" ng-click="runDpd()">Run DPD</button>
          </div>
          <div class="col-xl-4 col-md-4">
            <label></label>
            <button id="savepoint" type="button" class="form-control btn btn-info" ng-disabled="showScaleActive" ng-click="apply()">Save
              Point</button>
          </div>

        </div>
      </div>

$scope.calChange = function(){
     document.getElementById('calibration')
     .addEventListener('change',function(e){

        e.preventDefault();

        if(e.target.id == 'calpoint'){
            $scope.calPoint = parseInt(e.target.value); 
                

            var data = [{"offset": $scope.data[1].offset, "value": "0" +$scope.calPoint.toString(16), "convertType": 0 }];
           

            CalModel.setCalPoint(data[0]).then(function(response){

                console.log(response.data);

            });

           
        }else if(e.target.id == 'caloffset'){
            $scope.calOffset = parseFloat(e.target.value);

            $scope.calOffset = $scope.calOffset * 1000;
                     

            var data = [{"offset": $scope.data[2].offset, "value":"0" + $scope.calOffset.toString(16), "convertType": 0 }];
                      
            CalModel.setCalOffset(data[0]).then(function(response){
                
                console.log(response.data);

            });
          
        }else if(e.target.id == 'scaleoffset'){
            $scope.Scale = parseInt(e.target.value);               

            var data = [{"offset": $scope.data[3].offset, "value":"0" + $scope.Scale.toString(16), "convertType": 0 }];
           

            CalModel.setScale(data[0]).then(function(response){
                console.log(response.data);

            });
           
        }else if(e.target.id =='algorithm'){
            $scope.algorithm = parseInt(e.target.value);                   

            var data = [{"offset": $scope.data[4].offset, "value": "0" +$scope.algorithm.toString(16), "convertType": 0 }];
            
            CalModel.setAlgorithm(data[0]).then(function(response){
                console.log(response.data);

            });
        }

       

    });
    
}