服务中有多个http.get

时间:2017-02-05 15:54:23

标签: angularjs service

我想在我的服务中使用多个(在本例中为2)$http.get

如您所知,使用$http.get的简单形式是:

  app.factory('MyService', function ($http, $q) {
    return {
      getData: function() {
        return $http.get('myfile.json')
          .then(function(response) {
          return response.data;
        });
      }
    };
  });

现在我想使用2个文件(2 $http.get s)并将它们相互比较(有一些for循环等我可以...)!

我现在能做什么? :(

2 个答案:

答案 0 :(得分:2)

使用$ q.all。

将$ q添加到控制器的依赖项,例如

$scope.req1 = $http.get('myfile.json');
$scope.req2 = $http.get('myfile2.json');

$q.all([$scope.req1, $scope.req2]).then(function(data) {
   // data is array of your files

   if ( JSON.stringify(data[0]) === JSON.stringify(data[1])){
      console.log('is equal');
   }
});

答案 1 :(得分:2)

这是Hajji Tarik解决方案的延伸。我能够从你的评论中得出你还不清楚在哪里编码。所以我开发了一个示例应用程序,它将帮助您实现相同的目标。

//--app.module.js--//
angular.module('notesApp', []);

//--app.service.js--//
angular.module('notesApp')
  .factory('notesFactory', ['$http',
    function($http) {
      var notesService = {};
      notesService.getData = function(url, method) {
        return $http({
          url: url,
          method: method
        });
      }
      return notesService;
    }
  ]);

//--app.controller.js--//
angular.module('notesApp')
  .controller('MainController', ['$scope', '$http', '$log', '$q', 'notesFactory',
    function($scope, $http, $log, $q, notesFactory) {
      $scope.data = {};
      var data1 = notesFactory.getData('http://localhost:3000/api/notes/1', 'GET');
      var data2 = notesFactory.getData('http://localhost:3000/api/notes/2', 'GET');
      var combinedData = $q.all({
        firstResponse: data1,
        secondResponse: data2
      });
      combinedData.then(function(response) {
        $log.log(response.firstResponse.data);
        $log.log(response.secondResponse.data);
        //Write your comparison code here for comparing json results.
      }, function(error) {
        $scope.data = error;
      });
    }
  ]);
<html ng-app='notesApp'>

<head>
  <title>
    Notes Application
  </title>
</head>

<body>
  <div ng-controller='MainController'>

  </div>



  <script src='https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js'></script>
  <script src='app.module.js'></script>
  <script src='app.controller.js'></script>
  <script src='app.service.js'></script>
</body>

</html>