Angular JS在Backgroud中使用$ timeout或$ interval服務獲取信息

我想從後臺使用$ timeout或$ interval服務從webapi獲取信息。

我有一個關於$超時或Angular JS的$ interval服務的問題。我在使用這些服務時遇到了一些問題，當我們在我們的控制器中注入任何這些服務時。以下是我目前的發展情況： - 應用程序中有多個嵌套控制器。 - 當我們試圖從一個狀態移動到另一個狀態時，再次調用$ timeout或$ interval服務。（這可以通過取消在範圍銷燬計時器來避免） - 但是，如何維護定時器信息。

我們可以創建服務或工廠來實現嗎？

來源

2016-04-10 k_pranav91

不會對你的$超時和$間隔做更多的信息：是的，可以。 – JanS

@JanS 你好，我目前正在從Api Server中提取最新的數據。每個API請求有5分鐘的時間間隔。但是，當我從一個狀態到另一個計時器再次被調用。注意：該計時器代碼寫入第一個父控制器。 –

你有這個代碼片段嗎？ –

是的，你可以使用這個工廠。這將僅實例化$ timeout和$ interval一次。

通過建立工廠類似下面，你可以共享數據中檢索/從控制器的$區間內創建（參見下圖）：

angular.module('app') 
    .factory('interval', interval); 

interval.$inject = ['$interval']; 

function interval($interval) { 
    var counter = {}; 
    activate(); 

    return { 
    counter: counter 
    }; 

    function activate() { 
    $interval(increaseCounter, 1000); 
    } 

    function increaseCounter() { 
    if(angular.isUndefined(counter.count)) { 
     counter.count = 0; 
    } else { 
     counter.count++; 
    } 
    } 
}

而這裏的控制器：

angular.module('app') 
    .controller('TestController', testController); 

testController.$inject = ['interval']; 

function testController(interval) { 
    var vm = this; 
    this.counter = interval.counter; 
}

現在你可以在視圖中顯示的計數器（或者您從$間隔得到任何數據）：

<div ng-controller="TestController as ctrl"> 
    {{ctrl.counter.count}} 
</div>

重要通知是，你不能直接分享count。這是因爲JavaScript處理通過引用/值傳遞值的方式。

這裏的工作小提琴：https://jsfiddle.net/m5hw5w1o/

來源

2016-04-10 14:07:27 JanS

該解決方案適用於我。這對像我這樣的開發者很有幫助。 –

Angular JS在Backgroud中使用$ timeout或$ interval服務獲取信息

回答

相關問題