title: Avoid to run Angular Controller twice/Ajax call
body: <p>I try to call a function inside a controller but it runs twice and, as you may know this is not viable, specially if you want to insert a record into a database because the data duplicates "itself". </p>
  
  <p>Here you have the code I'm using</p>
  
  <p>The Module, Factory and Controller I'm using is this (contained in <code>AdminController.js</code>):</p>
  
  <pre><code>var $biocompadmin = angular.module('BioCompAdminApp', ['ngGrid'], function($interpolateProvider) {
      // Se ha cambiado la nomenclatura de Angular {{}} para que no choque con la de Blade
      // en Laravel. Ahora se empleará &lt;% %&gt;.
      $interpolateProvider.startSymbol('&lt;%');
      $interpolateProvider.endSymbol('%&gt;');
  });
  
  $biocompadmin.factory('modifyHCSection', function($http, $q){
      return{
          executeCode: function(obj){
              //console.log("antes ...");
              var deferred = $q.defer();
  
              var datos = [];
              item = {};
              item['search'] = obj;
              datos.push(item);
              datos = JSON.stringify(obj);
  
              $url = '../../hc_sections/' + obj.id;
  
              $http.put($url, {data:datos})
              .then(function(result) {
                   //resolve the promise as the data
                  //console.log(result.data[1]['name']);
                  console.log("Ejecucion A: " + result.data);
  
                  deferred.resolve(result.data);
               });
              return deferred.promise;
          }
      };
  });
  
  
  $biocompadmin.controller("modHCSectionCtrl", function($scope,modifyHCSection,$window) {
  
      $scope.formData = {};
  
      $scope.sendForm = function() {
           modifyHCSection.executeCode($scope.formData).then(function(data){
              console.log(data);
              if(data['success']){
                  alert(data['message']);
                  $window.location.href ="../../hc_sections";
              }else{
                  alert(data['errors']['fallo']);
              }
              //$scope.message = data.message;
          });
      };
  });
  </code></pre>
  
  <p>The HTML is:</p>
  
  <pre><code>&lt;div ng-controller="modHCSectionCtrl" id="modHCSection"&gt;
  &lt;div class="panel panel-default" id="editHCSection" &gt;
  &lt;div class="panel-heading" &gt;&lt;h3 class="panel-title"&gt;Modificando la Sección Pediatria&lt;/h3&gt;&lt;/div&gt;
  
  &lt;div class="panel-body"&gt;
  &lt;form id="modHCSectionForm" name="modHCSectionForm" ng-submit="sendForm()"
  &gt;
      &lt;input type="hidden" ng-model="formData.id" ng-init="formData.id='11'" /&gt;
      &lt;div class="col-md-12 form-group"&gt;
          &lt;label class="control-label"&gt;Nombre&lt;/label&gt;
          &lt;input type="text" class="form-control" name="name" id="name" placeholder="" ng-model="formData.name" ng-init="formData.name='Pediatria'"
             data-bv-notempty="true"
             data-bv-notempty-message="El nombre de la sección es obligatorio y no puede estar vacío"
  
             data-bv-stringlength="true"
             data-bv-stringlength-max="100"
             data-bv-stringlength-message="La longitud del nombre debe ser menor de 100 caracteres"
          /&gt;
      &lt;/div&gt;
      &lt;br&gt;
  
     &lt;div class="col-md-12 form-group"&gt;
          &lt;label class="control-label"&gt;Contacto&lt;/label&gt;
          &lt;input type="text" class="form-control" name="contact" id="contact" placeholder="" ng-model="formData.contact" ng-init="formData.contact='Manuel Pena'"
              data-bv-notempty="true"
              data-bv-notempty-message="El nombre del contacto es obligatorio y no puede estar vacío"
  
              data-bv-regexp="true"
              data-bv-regexp-regexp="^[a-zA-Z\s]+$"
              data-bv-regexp-message="El nombre del contacto solo puede contener caracteres y espacios en blanco sencillos"
  
          /&gt;
      &lt;/div&gt;
      &lt;br&gt;
  
      &lt;div class="col-md-6 form-group"&gt;
              &lt;label class="control-label"&gt;Telefono 1&lt;/label&gt;
              &lt;input type="text" class="form-control" name="phone1" id="phone1" placeholder="" ng-model="formData.phone1" ng-init="formData.phone1=''"
              /&gt;
      &lt;/div&gt;      
      &lt;div class="col-md-6 form-group"&gt;
          &lt;label class="control-label"&gt;Telefono 2&lt;/label&gt;
          &lt;input type="text" class="form-control" name="phone2" id="phone2" placeholder="" ng-model="formData.phone2" ng-init="formData.phone2=''"
          /&gt;
      &lt;/div&gt;
      &lt;br&gt;
  
      &lt;div class="row"&gt;
      &lt;div class="col-md-6 pull-right"&gt;
          &lt;div class="pull-right"&gt;
              &lt;button id='modifyHCSection_Cancel' type="button" class="btn btn-danger"&gt;Cancelar&lt;/button&gt;
              &lt;button id='modifyHCSection_Save' type="submit" class="btn btn-primary"&gt;Guardar&lt;/button&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  
  
  
  &lt;/form&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Approach 1: not repeat the controller call twice</p>
  
  <p>I try it, I supose there is no double call in the HTML</p>
  
  <p>Approach 2: take out the data function from the controller</p>
  
  <p>As you can see I create a factory to separate the data from the controller and I'm using $q.defer to "defer" the answer and execute code after the asynchronous call ends.</p>
  
  <p>So, I insist, maybe a newbie question but I really appreciate any help you can give me in this matter.</p>