Va bene fare la richiesta di $ http per la risoluzione di ui.router in angularjs?

Question

Ho il seguente codice (sotto), funzionano perfettamente per me e per quello che mi serve almeno. Ma sono piuttosto scettico su questo, ho la sensazione che sia troppo bello per essere vero. Dal momento che sto lottando con il comportamento asincrono di $http questo mi ha aiutato molto a utilizzare l'oggetto risposta dalla richiesta $http a livello globale sul controller.

Voglio solo sapere se è il modo giusto o almeno accettabile o devo usare il modo convenzionale di usare $http come quello su AngularJS' Documentation prima di andare avanti con il mio progetto. Le risposte mi aiuteranno molto. Grazie.

$ 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', 
    }) 

regolatore

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

Answer 1

Penso che questo è probabilmente il miglior caso d'uso per una risoluzione ui-router.

In ogni caso preferirei racchiudere la mia chiamata http in servizi e chiamare questi servizi nella risoluzione invece di utilizzare $ http direttamente.

Questo può apparire come segue:

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

Grazie a che è possibile chiamare questo metodo in tutta l'applicazione (e centralizzare allo stesso tempo).

In regolatore:

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

In una risoluzione:

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

andare avanti con questo approccio, si è in un buon modo.

Spero che abbia aiutato.

MODIFICA: creato un plunker per aggiungere un esempio concreto di questi metodi.