角度最佳實踐。控制器動作觸發動畫

Question

我想在等待（輪詢）服務器時顯示一些進度圈。我正在使用一些jquery circle-progress插件。我想知道什麼是有條件地開始圈子進展的最常用方法，然後在某個時間通知它停止。然後我想讓這個圓圈完整地完成（額外的時間），並通知控制器'圓'動畫完成。

我現在要做什麼，我會爲循環過程創建指令，並觀察一些屬性以知道何時開始/停止動畫。然後，當觀察completed屬性更改爲true時，指令完成當前正在執行的圓，做一些額外的動畫（淡出）並調用'on-change'屬性以通知控制器。

對我來說，看起來我太複雜了。我需要觀察許多屬性'何時開始'，'何時停止'，然後是回調方法的額外屬性。

這是一種常見的方法嗎？也許我應該嘗試用動畫做這些事情？當我想將一些現有的jquery UI features集成到角度應用程序中時，我總是面臨這個問題。

P.S.我希望這個指令可以在許多不同的控制器中重用。

Plunker example with 'stopping' animation and notifying controller

Answer 1

我不會把它放在一個控制器，該指令是DOM互動的正確位置。根據我所瞭解的您的問題，您需要注意頁面上多個區域的更改。你不一定需要爲此觀察多個變量。您可以將多個變量名作爲屬性傳遞給指令，然後設置爲

scope.$watch(attrs.MyVar, function() { 
     //Do something 
     scope[attrs.MyFunc](); 

}）;

像這樣。