在放置在视图中的 javascript 中传递 $rootScope 值

Question

所以正如问题标题所说，我的 $rootScope 中有一个 object（我们称它为 $rootScope.appConfiguration），它在我的 .运行中取一个值模块：

angular.module('myapp',[...])
.provider('appConfigurationProvider',function(){...})
.constant(...)
.run(function($rootScope) {
$rootScope.appConfiguration = appConfiguration;
});

（...部分只是跳过代码，以提高可读性）

然后我在我的 index.html 我正在实施 angulartics-piwik:

<body ng-app>

<!-- Piwik -->
<script type="text/javascript">
var _paq = _paq || [];
//_paq.push(['trackPageView']);
_paq.push(['enableLinkTracking']);
(function() {
    var u = appConfiguration.PiwikUrl;
    _paq.push(['setTrackerUrl', u + 'piwik.php']);
    _paq.push(['setSiteId', appConfiguration.PiwikSiteId]);
    var d = document, g = d.createElement('script'), s = d.getElementsByTagName('script')[0];
    g.type = 'text/javascript';
    g.async = true;
    g.defer = true;
    g.src = u + 'piwik.js';
    s.parentNode.insertBefore(g, s);
})();
</script>
<!-- End Piwik Code -->
...

如您所见，我想使用 appConfiguration object、PiwikUrl 和 PiwikSiteId 中的 2 个值，但我不知道如何 "pass" object [=26] =].显然，代码现在是我收到 "appConfiguration is not defined" 错误消息..

Answer 1

将您的变量推送到 window 全局对象中。像下面一样，然后在你的 piwik 配置脚本中像 window.objectname 一样访问它。

添加此代码以将 appConfiguration 添加到 window 对象中。

window.appConfiguration = $rootScope.appConfiguration ;

然后在您的 piwik 配置中，您可以像

一样访问它

var _paq = _paq || [];
//_paq.push(['trackPageView']);
_paq.push(['enableLinkTracking']);
(function() {
    var u = window.appConfiguration.PiwikUrl;
    _paq.push(['setTrackerUrl', u + 'piwik.php']);
    _paq.push(['setSiteId', window.appConfiguration.PiwikSiteId]);
    var d = document, g = d.createElement('script'), s = d.getElementsByTagName('script')[0];
    g.type = 'text/javascript';
    g.async = true;
    g.defer = true;
    g.src = u + 'piwik.js';
    s.parentNode.insertBefore(g, s);
})();

更新：

angular.element(document).ready(function () {
    // put your piwik code here
});

Answer 2

我建议使用一种不同的方法，使用服务和配置常量（您可以将它们组合在提供程序中）：

常量定义：

angular.module('myApp')
  .constant('AppConfiguration', { ... });

服务：

angular.module('myApp')
  .factory('PiwikService', ['$window', 'AppConfiguration',
    function($window, AppConfiguration) {
      return {
        init: function() {
          $window._paq = $window._paq || [];

          var _paq = $window._paq;
          _paq.push(['enableLinkTracking']);

          var u = AppConfiguration.PiwikUrl;

          _paq.push(['setTrackerUrl', u + 'piwik.php']);
          _paq.push(['setSiteId', AppConfiguration.PiwikSiteId]);

          var g = angular.element('<script>')[0], 
              s = angular.element(document).find('script')[0];

          g.type = 'text/javascript';
          g.async = true;
          g.defer = true;
          g.src = u + 'piwik.js';
          s.parentNode.insertBefore(g, s); 
        }
      };
    }
  ]);

然后您可以使用这个新服务在运行块中初始化 Piwik。

angular.module('myApp',[...])
  .run(['PiwikService',
    function(PiwikService) {
      PiwikService.init();
    }
  ]);

在放置在视图中的 javascript 中传递 $rootScope 值

Passing a $rootScope value in a javascript that is placed within a view

javascript

angularjs

angulartics

更新：