Question

我的控制器：

$scope.totals = totals;

我的模板（按预期的html注入工作）：

{{totals}}

但我需要的是访问模板中脚本中的变量totals，如下所示：

<script>
  var totals = ????;
  // do stuff with totals
</script>

我已尝试$scope.totals，$totals，{{totals}}等，但无济于事。我要感谢任何见解，谢谢！

编辑：

以下是我的控制器和模板的jsfiddle。在模板内部，我想插入一个使用$scope.totals变量的脚本。

http://jsfiddle.net/38CrC/

Answer 1

首先，AngularJS背后的想法是喜欢这样的情况。

就AngularJS而言，你可能最好重新考虑你的应用程序并使用一个指令来封装你当前在脚本标签中编写的代码。

然而，话虽如此，有一种方法可以访问这样的范围：

var $element = $('#elementId');

var scope = angular.element($element).scope();

您可以阅读documentation了解详情。

但如上所述，在大多数情况下，这不是推荐的做法。

希望有所帮助！

OP发布jsFiddle后更新：

为方便起见，我在http://jsfiddle.net/jvandemo/hYnBa/1/

创建了一个有效的jsFiddle

由于您的示例包含一个带有div属性的简单ng-controller，因此您可以像这样访问范围：

<script>
    $(document).ready(function(){
        var $element = $('div[ng-controller="AdminEventsCtrl"]');
        var scope = angular.element($element).scope();
        console.dir(scope);
    });
</script>

以下是发生的事情：

您选择元素（在本例中使用jQuery）
将元素包装为AngularJS元素（在元素上公开额外的方法）
您在元素

scope()

然后，您可以访问范围属性，例如scope.totals

希望有所帮助！

Answer 2

OP答案：

我最终不得不使用指令来找到我想要的值。在设置我想要使用的值的控制器中，我添加了一个指令，使它看起来像这样：

'use strict';

angular.module('AdminApp')
  .controller('AdminEventsCtrl', function ($scope, collection) {
    $scope.totals = collection;
  }).directive('foo', function(){
    return {
        restrict: 'A',
        link: function(scope, elem, attrs){
            //Use scope.totals here
        }
    }
});

在我的模板中，我有声明：

<div foo></div>

这让我有能力用变量总数做我需要的东西。

特别感谢@jvandemo帮助我做出这个答案。

如何从模板脚本访问AngularJS变量

2 个答案: