如何将变量传递给AngularJs配置

Question

我使用 AngularJS Google Maps，需要在模块的 config 部分配置 api_key。（类似于 这个问题）。我的问题是关于 AngularJs 模块的配置。这是 我的测试代码：

var app = angular.module('myapp', [])
  /* 
     // HERE ????? 
     // I try to pass a value from the HTML (server side)

  .config(function($window){
    console.log($window.memKey);
  }) 

  */
  .controller('MainCtrl', ['$scope', '$window', function($scope, $window) {
    $scope.name = $window.memName;
    $scope.city = $window.memCity;

    $scope.getMember = function(id) {
      console.log(id);
    };
  }]);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<script type="text/javascript">
  var memKey = 'bb7de28f-0f89-4f14-8575-d494203acec7';
  var memName = 'John';
  var memCity = 'New-York';
</script>   

<div  ng-app="myapp" ng-controller="MainCtrl">
  Member name: {{name}} <br>
  Member city: {{city}}
</div>

如何从HTML（服务器）端恢复memKey值？

- serge

Answer 1

根据你声明的方式，你的memKey在可访问的范围内。

只需要执行：

 app.config(function(){
    console.log(memKey);
  }) 

查看 snippet

- Gonzalo.-

---

太神奇了！你说得对...现在有没有更“正确”的方法来传递值给配置函数？ - serge

您可以将提供程序传递给配置函数，其中它们可以是服务、值或常量。后两者对您可能会有所帮助。请参阅https://gist.github.com/demisx/9605099以获取每个的说明，然后看看哪个更适合您。可能是一个常量。然后您可以在配置函数中使用它们作为参数。 - Gonzalo.-

“configurable”一栏是否意味着它们不在.config中可用，因为示例在控制器上而不是配置函数上... - serge

它们是示例，您也可以将它们注入配置中。 - Gonzalo.-

Answer 2

如果你不使用注入数组，就可以访问现有的angular模块。获取引用后，你可以声明常量，例如：

<script type="text/javascript">
 var app = angular.module('myapp');  
 app.constant('memKey', 'bb7de28f-0f89-4f14-8575-d494203acec7');
 app.constant('memName', 'John');
 app.constant('memCity', 'New-York');
 //Or do them as one config object
</script>   

--

  .config(['memKey', 'memName','memCity'  function(memKey, memName, memCity) {
  }]);

- Dylan Watt

---

注意：这些值应该在.config部分中使用，而不是在.controller中使用。 - serge

你可以将常量注入到配置中，它们会首先被初始化。我更新了我的答案以反映你实际的问题。 - Dylan Watt

Codepen在HTML标签脚本完成后加载angular，这样会导致错误。另外，不要将常量包装在加载事件中，这是不必要的。 - Dylan Watt

这是关于编程的内容，请将以下文本从英语翻译成中文。仅返回已翻译的文本：这次更新了真正的字面常量，还有另一个错误：http://codepen.io/anon/pen/dYeGbN?editors=101 - serge

这只是一个与 CodePen 和 Angular 的加载时间有关的问题，请参见 http://codepen.io/anon/pen/MaGymm?editors=101。我将常量定义添加到了 JS 窗格中。它们只需要在引入 angular.js 后和模块被初始化声明后包含即可。 - Dylan Watt

是的...在JSFiddle中，当在head部分加载angular时似乎工作得更好...http://jsfiddle.net/r9oeuvgp/ - serge