javascript或角度传递/按参考数据绑定

因此，我对javascript是新手，甚至对angular是新手，我有一个“我该怎么做”的问题：在我的angular仪表板控制器中，我编写了一些代码，使互动程序看起来像在Windows phone上一样。它只显示一个数字，但使用实时数据绑定从0开始计数。我的问题是如何将它重构到另一个模块，这样我就可以调用zoomUpFromZero（databoundField）这样的方法。我来自C#背景，通过引用传递数据绑定字段。但在javascript中，这似乎是不可能的

var devCount = vm.deviceCount;
vm.deviceCount = 0;
var prom;

function zoomFromZero() {
  if (vm.deviceCount >= devCount) {
    stopit();
  } else {
    vm.deviceCount++;
    prom = common.$timeout(zoomFromZero, 30);
  }
};

function stopit() {
  common.$timeout.cancel(prom);
};

zoomFromZero();

我会将整个过程封装在一个函数中，让它计算出正确的调用间隔毫秒数，使其花费大约一秒钟的时间。这可以做到吗？

这里有一个解决方案：

这里的总体思想是将“缩放”包装成一个视图，这是负责执行DOM操作的角度对象。对于子孙后代，以下是代码：

angular.module('stackoverflow', []).directive('zoomToNumber', ['$timeout', function($timeout) {
    return {
        restrict: 'A',
        scope: {
            zoomToNumber: '='
        },
        link: function(scope, element) {
            scope.$watch('zoomToNumber', function(num) {
                var currentNumber = 0;

                function updateNumber() {
                    element.text(currentNumber);

                    if(currentNumber < num) {
                        $timeout(updateNumber, 20); // here's your interval
                    }

                    currentNumber++;
                }

                updateNumber();
            });
        }
    };
}]);

angular.module（'stackoverflow'，[]）。指令（'zoomToNumber'，['$timeout'，函数（$timeout）{
返回{
限制：“A”，
范围：{
zoomToNumber:“=”
},
链接：功能（范围、元素）{
作用域$watch（'zoomToNumber'，函数（num）{
var currentNumber=0；
函数updateEnumber（）{
元素。文本（当前编号）；
如果（currentNumber

请注意，我们引入了AngularJS的

$timeout

服务，这很重要，因为它包装了

window.setTimeout

，并将其连接到Angular的摘要处理中。如果您想变得更有趣，还可以将内容添加到

范围

散列中，以允许参数化间隔等。

这里有一个解决方案：

这里的总体思想是将“缩放”包装成一个视图，这是负责执行DOM操作的角度对象。对于子孙后代，以下是代码：

angular.module('stackoverflow', []).directive('zoomToNumber', ['$timeout', function($timeout) {
    return {
        restrict: 'A',
        scope: {
            zoomToNumber: '='
        },
        link: function(scope, element) {
            scope.$watch('zoomToNumber', function(num) {
                var currentNumber = 0;

                function updateNumber() {
                    element.text(currentNumber);

                    if(currentNumber < num) {
                        $timeout(updateNumber, 20); // here's your interval
                    }

                    currentNumber++;
                }

                updateNumber();
            });
        }
    };
}]);

angular.module（'stackoverflow'，[]）。指令（'zoomToNumber'，['$timeout'，函数（$timeout）{
返回{
限制：“A”，
范围：{
zoomToNumber:“=”
},
链接：功能（范围、元素）{
作用域$watch（'zoomToNumber'，函数（num）{
var currentNumber=0；
函数updateEnumber（）{
元素。文本（当前编号）；
如果（currentNumber

---

请注意，我们引入了AngularJS的

$timeout

服务，这很重要，因为它包装了

window.setTimeout

，并将其连接到Angular的摘要处理中。如果你想变得更有趣，你也可以在

范围
散列中添加一些东西，以允许参数化间隔，等等。
你可以将一个函数传递到你的缩放函数中，该函数设置字段以模拟通过引用传递字段。e、 g

function zoomRange(setField, minValue, maxValue) {
    setField(minValue);
    minValue++;

    if (minValue <= maxValue) {
        $timeout(function() {zoomRange(setField, minValue, maxValue);}, 50);
    }
};

然后，您可以将
zoomRange（）
函数移动到外部服务。
您可以将一个函数传递到缩放函数中，该函数将字段设置为模拟通过引用传递字段。e、 g

function zoomRange(setField, minValue, maxValue) {
    setField(minValue);
    minValue++;

    if (minValue <= maxValue) {
        $timeout(function() {zoomRange(setField, minValue, maxValue);}, 50);
    }
};

然后您可以将
zoomRange（）
函数移动到外部服务。
我应该想到这一点。朴素典雅。谢谢你，罗布！我应该想到这一点。朴素典雅。谢谢你，罗布！美好的zoomy惊人。最简单的解决方案，可能是正确的——用指令装饰元素，它就可以工作了。谢谢现在如何让我的代表站起来，这样我就可以投票了…很好！zoomy惊人。最简单的解决方案，可能是正确的——用指令装饰元素，它就可以工作了。谢谢现在如何让我的代表站起来，这样我就可以投票了。。。