Tengo un entorno de desarrollo y producción en el que mis URL difieren:

producción:

www.exmaple.com/page

desarrollo:

dev.environment/project/page

Sé que puedo establecer la URL base en AngularJS con el

<base href='/project/' />

Pero eso no me ayuda aquí. Antes de cargar mi aplicación AngularJS, busco un archivo de configuración (en app.js, con el.run sentencia, que lee una variable que tiene el entorno:

]).run([
  '$rootScope',
  '$http',
  function (
    $rootScope,
    $http
  ) {
    var configDeferred = $q.defer();

    // fetch config and set the API    
    $http.get('config.json').then(function(response) {
      $rootScope.config = response.data;
      configDeferred.resolve();
    });

    // Wait for the config to be loaded, then go to state
    $rootScope.$on('$stateChangeStart', function (event, next, current) {
      event.preventDefault();
      $q.all([configDeferred.promise]).then(function() {
        $state.transitionTo(next.name);
        return;
      });
    });

¿Hay una manera de establecer dinámicamente la URL base, basada en un archivo de configuración recuperado en AngularJS (quizás con un .htaccess)?

Intento 1: Trate de obtener la configuración a través de.run y establecer la url base a través de ng-href:

Edite la siguiente línea de código en mi app.js:

// fetch config and set the API    
$http.get('config.json').then(function(response) {
  $rootScope.config = response.data;
  $rootScope.baseUrl = response.data.baseUrl; // '/project/'
  configDeferred.resolve();
});

y en mi index.html:

<base ng-href="{{baseUrl}}" />

Parece que esto no funciona: cuando cambio el atributo href de la etiqueta a ng-href, carga el contenido correctamente, pero mi URL cambia adev.environment/page en lugar dedev.environment/project/page

ACTUALIZAR: El archivo de configuración:

{
  "mode": "development",
  "baseUrl": "/project/"
}