Angular.js：觀察一個對象的高度並更新其他對象的填充

Question

我可以在指令中觀察一個對象的屬性（實際上是clientHeight）。但是如何根據這個高度來改變其他物體的填充頂部？我知道如何使用jQuery來做到這一點，但我正在尋找一種Angular方式。

在Angular中，可以使用指令訪問某個頁面元素。好的，但如何訪問同一指令中的其他頁面元素？

Answer 1

有很多方法可以做到這一點。對於下面的所有建議，假設您有兩個指令–一個用於監視clientHeight，另一個用於調整填充。

• 創建一個服務（注入到兩個指令中）。讓第一個指令修改服務中的對象屬性（例如，someObj.prop1）。其他指令$監視該對象的屬性。
• 使用事件。讓第一個指令$ emit或$廣播一個事件，第二個指令可以使用$ on（在其鏈接函數或其控制器中）監聽它。

• 如果存在祖先關係，則可以在後代指令中指定require祖先指令的控制器。一個例子見AngularJS: reuse component with different parent。

• 不推薦，但另一種選擇是：使用$ rootScope而不是服務：在兩個指令中注入$ rootScope。讓第一個指令修改$ rootScope上的對象屬性。其他指令$監視該對象的屬性。