Javascript 在angular应用程序中动态设置基本URL_Javascript_Angularjs

Javascript 在angular应用程序中动态设置基本URL

javascript angularjs

Javascript 在angular应用程序中动态设置基本URL,javascript,angularjs,Javascript,Angularjs,我正在做一个AngularJS项目。我使用和$locationProvider.html5mode（）从URL中删除了# 根据环境的不同，我希望从配置文件动态更新base标记的href属性。我创建了一个包含简单配置的env.js env.js (function (window) { window.__env = window.__env || {}; window.__env.baseUrl = '/'; window.__env.enableDebug = true; }(t

我正在做一个AngularJS项目。我使用和$locationProvider.html5mode（）从URL中删除了#

根据环境的不同，我希望从配置文件动态更新base标记的href属性。我创建了一个包含简单配置的env.js

env.js

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

  window.__env.baseUrl = '/';

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

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

我在app.js中使用了这个env文件，并且在app.run（）中将$rootScope.baseurl更新为env.js中的baseurl。它在console.log（）中工作正常，但在my index.html中却不工作。我正在获取未编译的代码，即

{{{$rootScope.baseurl}}

app.js

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

  window.__env.baseUrl = '/';

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

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>


MYAPP

请帮帮我。谢谢

您不能使用angular进行设置，因为需要在对脚本、样式表、图像等页面资源发出任何请求之前进行设置，因为您使用的是相对路径

您可以尝试将

替换为以下内容：

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


文件。写（“”）；

或


document.getElementById（'base'）.href=window.\uu env.baseUrl；