javascript或angular pass/databind參考

所以我是新來的JavaScript，甚至更新的角度，並有一個'我該怎麼做'的問題：在我的角度儀表板控制器，我寫了一些代碼，使一個瓷磚外觀就像在Windows手機上一樣。它只是顯示一個數字，但用實時數據綁定從0開始計數。我的問題是如何重構這個到另一個模塊，所以我可以調用像zoomUpFromZero（databoundField）的方法。來自C＃背景，我會通過引用傳遞數據綁定字段。但在JavaScript中，這似乎不可能。javascript或angular pass/databind參考

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();

我會將整個事情都包裝在一個函數中，並讓它計算調用之間的毫秒數，以使其花費大約一秒。這可以做到嗎？

來源

2013-12-13 Rick242

這裏有一個解決方案：http://jsfiddle.net/bUkGL/1/

這裏的總體思路是包裹「放大」成directive，這是在角是負責做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(); 
      }); 
     } 
    }; 
}]);

注意我們帶來AngularJS的$timeout服務，這是很重要的，因爲它包裝window.setTimeout和電線成角的消化處理。你也可以，如果你想得到真正的喜歡，添加的東西到scope散列允許參數化間隔，等等。

來源

2013-12-13 15:43:45 FMM

不錯！ zoomy真棒。 – Rick242

最簡單的解決方案，可能是正確的 - 用指令裝飾元素，它只是工作。謝謝！現在如何讓我的代表，以便我可以投票... – Rick242

你可以只傳遞一個函數到你的縮放函數，設置字段模擬傳遞字段參考。例如

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

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

你可以調用該函數是這樣的：

zoomRange(function(val) {vm.deviceCount = val}, 0, 10);

然後你可以在zoomRange()功能移動到外部服務。

來源

2013-12-13 16:08:48 rob

我應該想到這一點。簡單而優雅。謝謝搶劫！ – Rick242

javascript或angular pass/databind參考

回答

相關問題