javascript - modulos - ng model ejemplo

Actualización automática de datos solo cuando se encuentran datos nuevos desde el servidor con AngularJS

Question

Soy totalmente nuevo en AngularJS y tengo una pregunta rápida sobre cómo actualizar una página solo cuando se recuperan datos nuevos del servidor.

He buscado pero no encontré nada similar a mi problema.

Tengo un Servicio y un Controlador con un intervalo Promesa de la siguiente manera:

MyService

angular.module(''MyService'', [''ngResource'']).
    factory(''Data'', function($resource){
      return $resource(''rest/getMyData'', {});
});

MyController

function MyController($scope,$interval,$http, Data) {

    $scope.refresh = function() {
        $scope.jobs = Data.query();
    };

    $scope.intervalPromise = $interval(function(){
          $scope.refresh();
    }, 10000);  

    // initial load of data
    $scope.refresh();
}

Los datos se recuperan del servidor con éxito cada 10 segundos, pero me gustaría que la página se actualice solo cuando se encuentran nuevos datos.

Un punto en la dirección correcta sería muy apreciado.

Answer 1

Puede comparar los datos recibidos del servidor con su conjunto de datos actual ( $scope.jobs ) y solo actualizar $scope.jobs si son diferentes.

function MyController($scope,$interval,$http, Data) {

    $scope.refresh = function() {
        var serverData = Data.query();
        if( serverData !== $scope.jobs ) {
            $scope.jobs = serverData;
        }
    };

    $scope.intervalPromise = $interval(function(){
          $scope.refresh();
    }, 10000);  

    // initial load of data
    $scope.refresh();
}

Answer 2

Creo que encontré una solución que funciona.

La respuesta de Ryan tampoco funciona para mí. Después de excavar un poco, parece que no funciona del todo bien, ya que la operación Data.query () tarda un poco en volver, y no ha llegado cuando llega a la comparación en el if(...) - por lo que siempre se invoca la actualización (y la pantalla simplemente "parpadea" cada diez segundos a medida que se actualiza a los mismos datos).

Para solucionarlo, necesita agregar un retraso con setTimeout() .

function MyController($scope,$interval,$http, Data) {
  $scope.refresh = function() {
      var serverData = Data.query();
      setTimeout(function(){
            if (serverData !== $scope.jobs){
               $scope.jobs = serverData;
            }
      }, 100);
  };

  $scope.intervalPromise = $interval(function(){
      $scope.refresh();
  }, 10000);  

  // initial load of data
  $scope.refresh();
}

De todos modos, eso me funciona, por lo que podría ser útil si alguien todavía tiene dificultades.