क्या एंगुलरजेज़ में ui.router के संकल्प पर $ http अनुरोध प्राप्त करना ठीक है?

Question

मेरे पास निम्न कोड (नीचे) है, वे मेरे लिए पूरी तरह से काम करते हैं और मुझे कम से कम क्या चाहिए। लेकिन मैं इस बारे में संदेह करता हूं, मुझे यह महसूस हो रहा है कि यह सच होना बहुत अच्छा है। चूंकि मैं $http के एसिंक व्यवहार के साथ संघर्ष कर रहा हूं, इसने मुझे नियंत्रक पर वैश्विक स्तर पर $http अनुरोध से प्रतिक्रिया ऑब्जेक्ट का उपयोग करने में बहुत मदद की।

मैं सिर्फ अगर इसकी सही तरीके से या कम से कम एक स्वीकार्य एक या मैं पहले मैं अपने प्रोजेक्ट के साथ आगे बढ़ने $httpAngularJS' Documentation पर एक तरह मिल का उपयोग करने का परंपरागत तरीके से उपयोग करना चाहिए जानना चाहते हैं। उत्तर मुझे बहुत मदद करेंगे। धन्यवाद।

$ stateProvider

$stateProvider 
    .state('test', { 
     url: '/test', 
     templateUrl: 'partial.template.html', 
     resolve : { 
      foo : function($http) { 
       return $http({ 
        method: 'GET', 
        url: '/api/something' 
       }); 
      }, 
      bar : function($http) { 
       return $http({ 
        method: 'GET', 
        url: '/api/something' 
       }); 
      }, 
     }, 
     controller: 'mainController', 
    }) 

नियंत्रक

.controller('mainController',['$scope', 'foo', 'bar', function($scope, foo, bar){ 
    $scope.fooObj = foo; 
    $scope.barObj = bar; 
}]) 

Answer 1

मुझे लगता है कि यह शायद एक ui रूटर संकल्प के लिए सबसे अच्छा USECASE है।

वैसे भी मैं अपनी http कॉल को सेवाओं में लपेटना पसंद करता हूं और सीधे $ http का उपयोग करने के बजाय इस सेवाओं को संकल्प में कॉल करना चाहता हूं।

यह कुछ ऐसा दिखाई देगा:

app.service('FooService',function($http){ 
    var service={}; 
    service.getFoo = function(){ 
     return $http({ 
       method: 'GET', 
       url: '/api/something' 
      }); 
    } 
    return service; 
}); 

कि के लिए धन्यवाद आप सभी अपने आवेदन के आसपास इस विधि कॉल कर सकते हैं (और एक ही समय में यह केंद्रीकृत)।

नियंत्रक में:

app.controller('MyController', function($scope, FooService) { 
    $scope.controllerName = "MyController"; 
    FooService.getFoo().success(function(foo){ 
     $scope.foo = foo 
    }); 
}); 

एक संकल्प में:

$stateProvider 
.state('test', { 
    url: '/test', 
    templateUrl: 'partial.template.html', 
    resolve : { 
     foo : function(FooService) { 
      return FooService.getFoo(); 
     }, 
    }, 
    controller: 'MyController', 
}) 

इस दृष्टिकोण के साथ पर जाओ, तुम एक अच्छी राह पर हैं।

आशा है कि इससे मदद मिलेगी।

संपादित करें: अभ्यास विधियों के ठोस उदाहरण को जोड़ने के लिए plunker बनाया गया।