2013-10-22 71 views
0

繁忙的指標對於$ http很重要。過濾器的Angularjs繁忙指示器

我有手機可能需要2或3秒的過濾器。 我想在顯示屏上「忙」顯示,直到Angular完成它的任務(過濾並重新繪製需要的內容),這樣用戶不會再次點擊。

是否有一個我可以訂閱的事件會幫助我將它連接起來?

+0

您應該意識到angularjs中的過濾器應該很短,因爲angular會經常調用它們。看看這個簡單的例子http://jsfiddle.net/mchrobok/eappK/1/。在控制檯中,您可以看到過濾器被調用的次數。在每個$摘要中都會使用角度調用過濾器,因此即使您單擊按鈕也會調用它們。我認爲它會掛起你的應用程序,如果你的過濾器執行2秒。 – mchrobok

+0

我還用我的解決方案准備了另一個jsfiddle:http://jsfiddle.net/mchrobok/8Xq4d/7/。不幸的是,除非在掩碼被隱藏之前設置斷點,否則掩碼不可見。我不知道爲什麼,因爲控制檯中的日誌是正確的 - 消息「顯示/隱藏掩碼」顯示正確。 – mchrobok

+0

我的應用程序運行良好。它可能不是我的過濾器,但Angular需要時間來重新顯示更新的內容。我只是想要一種「忙碌」顯示的方法。我最初是通過從服務器獲取更新(很多繁忙的指標)。當角度可以在本地執行時,看起來像浪費。 – Pablo

回答

0

是否有您需要事件的特定原因?我不認爲有一個,但你可以考慮把所有的過濾函數都包裝在一個通用的繁忙指標包裝器中。

function busyWrap(func) { 
    return function() { 
    Busy.start(); 
    try { 
     func.apply(this, Array.prototype.slice.call(arguments, 0)); 
    } finally { 
     Busy.stop(); 
    } 
    } 
}; 
在你的過濾器定義

然後改變這樣的事情

app.filter('filter', function() { 
    return function(input) { 
    return output; 
    }; 
}); 

這個

app.filter('filter', function() { 
    return busyWrap(function(input) { 
    return output; 
    }); 
}); 

的代碼可能不是完美的,但一個可重複使用的功能,將包過濾功能的想法是你最好的選擇。儘管如此,代碼佔用時間最長的代碼很可能是角度內部的(例如在排序列表中重新繪製大的ng-repeat),所以這可能無法幫助你。

+0

我嘗試了一些類似的東西(不夠高雅),但它沒有完成這項工作。我會更新這個問題,以便「做它的事情」更加明確。 – Pablo

0

我寫一個指令BusyIndi​​cator控件IsBusy =「IsBusySubmitting || IsBusyLoadingTemplate」

我還可以控制通過控制器範圍這樣的繁忙指示符層。

https://twitter.com/leblancmeneses/statuses/341368016556142594

+0

BusyIndi​​cator本身不是我的問題(有很多例子可用)。我的問題是如何通過處理我的過濾器時角度去激活它。 – Pablo

+0

知道何時停用某些東西 - 您需要使用promise API。我的busyindicator的邏輯駐留在控制器中。 –