在 AngularJS 表达式中调用全局变量

我的 head 标签中有一些全局变量：

<script type="text/javascript">
    var apiRoot = 'http://localhost:8000/api',
        apiUrl = apiRoot,
        apiBadgeUrl = apiRoot + '/badges',
        apiLevelUrl = apiRoot + '/levels',
        apiBehaviorUrl = apiRoot + '/behaviors',
        apiTrophyUrl = apiRoot + '/trophies',
        apiUserUrl = apiRoot + '/users',
        apiWidgetPreferencesUrl = apiRoot + '/widgetPreferences';
</script>

我想在 html 文件中使用角度表达式，但我的尝试失败了：

{{ $window.apiRoot }} or {{ apiRoot }} 

这些表达式根据当前范围进行计算。如果您没有通过控制器将它们设置在您的范围内，它将不会评估。看http://docs.angularjs.org/guide/expression http://docs.angularjs.org/guide/expression

Example:

function MyCtrl($scope)
{
   $scope.apiRoot = apiRoot;
}

HTML:

<div ng-controller="MyCtrl">
   {{apiRoot}}
</div>

正如已经提到的，虽然上面的示例有效，但不推荐使用。更好的方法是在服务中设置这些变量，然后通过服务获取它们。

function MyCtrl($scope, apiRootService)
{
   $scope.apiRoot = apiRootService.getApiRoot();
}

服务：

angular.module('myServices', []).factory('apiRootService', function() {
    var apiRoot = 'http://localhost:8000/api',
    apiUrl = apiRoot,
    apiBadgeUrl = apiRoot + '/badges',
    apiLevelUrl = apiRoot + '/levels',
    apiBehaviorUrl = apiRoot + '/behaviors',
    apiTrophyUrl = apiRoot + '/trophies',
    apiUserUrl = apiRoot + '/users',
    apiWidgetPreferencesUrl = apiRoot + '/widgetPreferences';
    return {
      getApiRoot: function() {
         return apiRoot
      },
      //all the other getters
   });