Utiliser ownProvider avec $ http call dans config

Question

J'ai lu beaucoup d'informations sur SO que je ne peux pas avoir $http appeler dans config mais ce que je peux faire est de créer son propre fournisseur et utiliser ce fournisseur dans une config.

Mais aucun des sujets que j'ai lus ne montre comment utiliser réellement les informations rassemblées dans le fournisseur d'appel API dans un config().

Ainsi, le fournisseur que j'ai créé est la suivante:

(function() { 
    'use strict'; 

    angular 
     .module('app', []) 
     .provider('translateOwnProvider', Provider); 

    function Provider() { 
     this.$get = function($http) { 

      $http({ 
       url: 'http://ipinfo.io/json', 
       method: 'GET' 
      }) 
      .then(function(response) { 
       var homeCountry = response.data.country; 
       var homeCountryLower = homeCountry.toLowerCase(); 
       console.log(response.data); 
      }, function(errorCall) { 
       console.log("error"); 
      }); 

      return homeCountryLower; 
      // ????? 
     }; 
    }; 

})(); 

Ainsi, dans la ligne 23 (en bas du script) je retourne valeur, je ne sais pas si c'est en fait une bonne façon de le faire, il est le premier temps que j'ai essayé et j'ai besoin de votre aide les gars.

suivant dans le fichier config nommé app.js vraiment commun que j'ai config avec

• routage
• définir un lenguage d'utilisateur

le code est:

(function() { 
    'use strict'; 

    angular 
     .module('app', [ 
      'ngRoute', 
      'pascalprecht.translate' 
     ]) 
     .config(config); 

    //$inject for minify issue 
    config.$inject = ['$routeProvider', '$translateProvider', 'translateOwnProvider']; 

    function config ($routeProvider, $translateProvider, translateOwnProvider) { 
     $routeProvider 
      .when('/', { 
       controller: 'mainCtrl', 
       templateUrl: 'views/main.html' 
      }) 
      .otherwise('/'); 

     // add translation tables 
     $translateProvider.translations('en', translationsEN); 
     $translateProvider.translations('de', translationsDE); 
     $translateProvider.translations('pl', translationsPL); 

     // preferredLanguage is gather should be gather in provider 
     $translateProvider.preferredLanguage('en'); 

     $translateProvider.fallbackLanguage('en'); 
     //fallbackLanguage in case somebody hides his IP 
    }; 


})(); 

En ligne 28 Je mets une langue preffered et je veux que ceci soit une valeur retournée dans propre provi der: homeCountryLower.

Pour l'instant je n'ai aucune erreur dans la console mais cela ne fonctionne pas évidemment et la page ne charge pas du tout, il reste vide.

Answer 1

J'ai terminé avec la conclusion qu'il n'est pas possible d'utiliser les informations recueillies à partir de l'appel backend au config(). Peut-être qu'il est possible d'utiliser une sorte de hack avec la fonction resolve mais je ne pouvais pas le comprendre. Ce que j'ai fait à la place de cet appel, c'est que j'ai utilisé window.navigator.language dans mon config() alors maintenant mon script de traduction n'est pas basé sur l'IP de l'utilisateur mais sur la langue du navigateur de l'utilisateur. Ce n'est pas aussi satisfaisant que IP parce que je peux toujours avoir un utilisateur qui vient de Pologne et qui a un navigateur configuré en anglais et ensuite ma page s'affichera en anglais.

Je pourrais aussi écrire propre service qui traduirait la page pour moi mais je voulais vraiment employer le module angulaire-translate: link to module.

Notez que j'ai utilisé window.navigator.language pas un $window car ce second n'est pas réalisable en config(). Donc, ma solution peut causer des problèmes lors des tests.

J'ai écrit ceci pour n'importe qui qui viendra dans ce sujet à l'avenir.

Answer 2

Je vous suggère de mettre l'appel API pour résoudre quelque chose comme ça. Cela assurerait votre app/main controller is not instantiated jusqu'à ce que l'appel de service soit terminé.

resolve: { 
    translateService: function($http, $route){ 
     return $http.get('http://ipinfo.io/json') 
     .then(function(response){ 
     return response.data; 
     }) 
    } 
} 

Maintenant, vous pouvez inject le translateService dans votre contrôleur et mettez-le dans un factory/service, que vous pouvez réutiliser dans l'application comme étant singleton dans la nature.