$ q를 $ http와 함께 사용

Question

내 $ routeProvider에는 컨트롤러를 인스턴스화하기 전에 API에서 데이터를 가져 오는 resolve 속성이 있습니다. $ http 서비스와 함께 $ q를 사용하면 컨트롤러에 데이터를 전달할 수 있습니다. 둘 다 똑같은 일을하지 않습니까? 컨트롤러에 데이터를 전달하는

AccountService.js

app.factory('AccountService', ['$http', '$q', function ($http, $q) { 
    return { 
     GetAccounts: function() { 
      return $http.get('api/Account/GetAccounts') 
      .then(function success(response) { 
       return response; 
      }, function error(response) { 
       ̶r̶e̶t̶u̶r̶n̶ throw console.log("Oops!"); 
      }); 
     }, 
    }; 
}]); 

: 데이터가 컨트롤러로 전달받을 수 없었던 경우 여기

내 원래의 접근 방식 GetAccounts를 다음으로 변경합니다.

app.factory('AccountService', ['$http', '$q', function ($http, $q) { 
    return { 
     GetAccounts: function() { 
      var deferred = $q.defer(); 
      $http.get('api/Account/GetAccounts') 
      .then(function (data) { 
       deferred.resolve(data.data); 
      }) 
      .catch(function (response) { 
       deferred.reject(response); 
      }) 

      return deferred.promise; 
     }, 
    }; 
}]); 

route.js

app.config(['$routeProvider', function ($routeProvider) { 
    $routeProvider.when('/users', { 
     template: '<admin accounts="$resolve.accounts"></admin>', 
     resolve: { 
      accounts: function (AccountService) { 
       return AccountService.GetAccounts() 
        .then(function (data) { 
         return data; 
        }) 
      } 
     } 
    }) 
}]); 

Answer 1

$ q를 약속에 대한 Angulars 래퍼입니다. $ http는 약속을 직접 반환하므로 새로운 $ q 또는 $ http로 약속을 새로 작성하는지 여부는 동일합니다.

Answer 2

AccountService에서 수행하는 작업을 본질적으로 수행하지 않아도됩니다.

app.factory('AccountService', ['$http', function ($http) { 
    return { 
     GetAccounts: function() { 

      return $http.get('api/Account/GetAccounts') 
      .then(function (data) { 
       return data.data; 
      }) 
     }, 
    }; 
}]); 

당신의 백엔드가 이미 그렇게하지 않는 한 당신의 결심을 처리하고 멋진 오류 구조로 오류를 래핑 할 수 있도록 .catch()를 저장합니다.

app.config(['$routeProvider', function ($routeProvider) { 
    $routeProvider.when('/users', { 
     template: '<admin accounts="$resolve.accounts"></admin>', 
     resolve: { 
      accounts: function (AccountService) { 
       return AccountService.GetAccounts() 
        .catch(function(err) { ̶r̶e̶t̶u̶r̶n̶ throw new BusinessError(err) }) 
      } 
     } 
    }) 
}]); 

또는 호출 컨트롤러/구성 요소가 아키텍처를 처리하게하십시오.