javascript - Angularjs如何在工厂中获取api

Question

我一直在寻找几个小时，找不到我需要的东西。有哪位好心人可以帮帮我吗？我试图从我的控制器翻译这样的东西：

      myApp.controller('displayCatController', ['$scope','$http','$q', 'displayAll', function($scope, $http, $q, displayAll){


              var CombinedName = [];
              //Display auditoriums information
              var CategoryAudit  = $http({
                  method: 'GET',
                  url:'https://developers.onemap.sg/publicapi/themeapi/retrieveTheme?queryName=auditoriums&token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOjMsInVzZXJfaWQiOjMsImVtYWlsIjoicHVibGljQXBpUm9sZUBzbGEuZ292LnNnIiwiZm9yZXZlciI6ZmFsc2UsImlzcyI6Imh0dHA6XC9cL29tMi5kZmUub25lbWFwLnNnXC9hcGlcL3YyXC91c2VyXC9zZXNzaW9uIiwiaWF0IjoxNTM4ODY2MTM3LCJleHAiOjE1MzkyOTgxMzcsIm5iZiI6MTUzODg2NjEzNywianRpIjoiOWZhMDVmZDUzNGRhNjU1ZDQ3YTgwODdmMGZkYjY1OGEifQ.2RbY7CGZY5hRfKZHVBels1XUDiAh9zU2lyUvePF8dXk'
                  }).then(function successCallback(response) {
                    $scope.auditoriums = response.data.SrchResults;
                    $scope.auditoriums.splice(0,1);
                  }, function errorCallback(response) {
                    console.log(response);
                  });

              //Display exhibitions information
              var CategoryExhibit = $http({
                        method: 'GET',
                  url: 'https://developers.onemap.sg/publicapi/themeapi/retrieveTheme?queryName=exhibitioncentres&token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOjMsInVzZXJfaWQiOjMsImVtYWlsIjoicHVibGljQXBpUm9sZUBzbGEuZ292LnNnIiwiZm9yZXZlciI6ZmFsc2UsImlzcyI6Imh0dHA6XC9cL29tMi5kZmUub25lbWFwLnNnXC9hcGlcL3YyXC91c2VyXC9zZXNzaW9uIiwiaWF0IjoxNTM4ODY2MTM3LCJleHAiOjE1MzkyOTgxMzcsIm5iZiI6MTUzODg2NjEzNywianRpIjoiOWZhMDVmZDUzNGRhNjU1ZDQ3YTgwODdmMGZkYjY1OGEifQ.2RbY7CGZY5hRfKZHVBels1XUDiAh9zU2lyUvePF8dXk'
                        }).then(function successCallback(response) {
                            $scope.exhibitions = response.data.SrchResults;
                    $scope.exhibitions.splice(0,1);
                        }, function errorCallback(response) {
                            console.log(response);
                        });


                // To combine all the $http API into one
                $q.all([CategoryAudit, CategoryExhibit, CategoryHotel]).then(function(){
                $scope.combine = $scope.exhibitions.concat($scope.auditoriums, $scope.hotels);
                // For loop to get only the names
                for (var i = 0; i < $scope.combine.length; i++){
                    if (i >= 0){
                        CombinedName.push($scope.combine[i].NAME);
                    }
                }

            });

      }]);

进入一个工厂，在那里我可以将我的 $http 调用放在那里以使其更清洁。我真的很感激任何帮助。

标签： javascriptangularjs

Answer 1

有关工厂和控制器使用情况，请参阅下面的示例代码。

//Factory
angular.module('myApp')
  .factory('dataFactory', ['$http', function($http) {

    var urlBase = '/api/customers';
    var dataFactory = {};

    dataFactory.getCustomers = function() {
      return $http.get(urlBase);
    };

    return dataFactory;
  }]);

//Controller
angular.module('myApp')
  .controller('myController', ['$scope', 'dataFactory',
    function($scope, dataFactory) {
      $scope.customers;

      getCustomers();

      function getCustomers() {
        dataFactory.getCustomers()
          .then(function(response) {
            $scope.customers = response.data;
          }, function(error) {
            console.log(error.message;)
          });
      }
    }
  ]);