2016-10-09 10 views
0

私はAngularJSプロジェクトに取り組んでいます。と$ locationProvider.html5mode()を使用してURLから#を削除しました。角度アプリでベースURLを動的に設定します

環境によっては、基本タグのhref属性を設定ファイルから動的に更新する必要があります。私は単純な構成を含むenv.jsを作成しました。

env.js

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

    window.__env.baseUrl = '/'; 

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

私は私のapp.jsでこのENVファイルを使用してenv.js.でbaseUrlにまでapp.run()内の更新の$ rootScope.baseurl console.log()では正常に動作していますが、index.htmlでは動作しません。私は私を助けてください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> 

{{ $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); 
     }); 

を取得しています。おかげ

答えて

2

それはあなたが相対パス

あなたが交換してみてください

を使用しているので、すべての要求は、スクリプト、スタイルシート、画像などのようなページのリソースに対して行われる前に設定する必要がありますので、あなたはそれを設定して、角度を使用することはできません

<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> 
:ようなもので <base>
関連する問題