Задайте базовый URL динамически в угловом приложении

Я работаю над проектом AngularJS. Я удалил # из URL с использованием и $ locationProvider.html5mode().Задайте базовый URL динамически в угловом приложении

В зависимости от среды я хочу, чтобы атрибут href для базового тега динамически обновлялся из файла конфигурации. Я создал env.js, который содержит простые конфигурации.

env.js

(function (window) { 
    window.__env = window.__env || {}; 

    window.__env.baseUrl = '/'; 

    window.__env.enableDebug = true; 
}(this));

Я использовал этот файл ENV в моем app.js и внутри app.run() обновлен $ rootScope.baseurl к BaseUrl в env.js. Он отлично работает внутри console.log(), но не в моем index.html. Я получаю некомпилированный код т.е. {{ $rootScope.baseurl }}

app.js

import controllers from './controllers'; 

     var env = {}; 

     if (window) { 
      Object.assign(env, window.__env); 
     } 

     var app = angular.module('myapp', ['ui.router', controllers]); 

     app.constant('__env', env); 

     app.config(function ($stateProvider, $urlRouterProvider, $locationProvider) { 

      $urlRouterProvider.otherwise("/"); 

      $stateProvider.state("home", { 
       url: "/", 
       templateUrl: "app/components/home/home.view.html", 
       controller: "HomeController" 
      }).state("login", { 
       url: "/login", 
       templateUrl: "app/components/login/login.view.html", 
       controller: "LoginController" 
      }); 

      $locationProvider.html5Mode({ 
       enabled: true, 
       requireBase: true 
      }); 
     }); 

     app.run(function($rootScope, __env){ 
      $rootScope.baseurl = __env.baseUrl; 
      console.log($rootScope.baseurl); 
     });

Index.html

<html ng-app="myapp"> 
     <head> 
      <title>MYAPP</title> 
      <base href="{{ baseurl }}"> 
     </head> 

     <body> 
      <div ui-view> 
      </div> 
     </body> 

     <script type="text/javascript" src="public/lib/js/angular.min.js"></script> 
     <script type="text/javascript" src="public/lib/js/angular-ui-router.min.js"></script> 
     <script type="text/javascript" src="env.js"></script> 
     <script type="text/javascript" src="public/app.js"></script> 

    </html>

Пожалуйста, помогите мне. Благодаря

источник

2016-10-09 Pankaj Agrawal

Вы не можете использовать угловой, чтобы установить его, так как он должен быть установлен до того, как запросы сделаны страницы ресурсов, таких как скрипты, таблицы стилей, изображения и т.д., так как вы используете относительные пути

Вы можете попробовать замены <base> что-то вроде:

<script type="text/javascript" src="env.js"></script> 
<script> 
     document.write('<base href="' + window.__env.baseUrl + '" />'); 
</script>

Или

<script type="text/javascript" src="env.js"></script> 
<base id="base"> 
<script>   
    document.getElementById('base').href = window.__env.baseUrl; 
</script>

источник

2016-10-09 15:06:19 charlietfl

Задайте базовый URL динамически в угловом приложении

ответ

Смежные вопросы