events - Angular.js：观察一个对象的高度并更新另一个对象的填充

Question

我可以在指令中观察一个对象的属性（实际上是-clientHeight）。但是如何根据这个高度改变其他对象的 padding-top 呢？我知道如何使用 jQuery 来做到这一点，但我正在寻找一种 Angular 方式。

在 Angular 中，可以使用指令访问某些页面元素。好的，但是如何访问同一指令中的其他页面元素？

Answer 1

有很多方法可以做到这一点。对于以下所有建议，假设您有两个指令——一个用于查看 clientHeight，另一个用于调整填充。

• 创建一个服务（注入到两个指令中）。让第一个指令修改服务中的对象属性（例如，someObj.prop1）。另一个指令 $watches 该对象属性。
• 使用事件。让第一个指令 $emit 或 $broadcast 一个事件，第二个指令可以使用 $on 监听它（在它的链接函数中或在它自己的控制器中）。

• 如果存在祖先关系，则可以require在后代指令中将祖先指令的控制器。有关示例，请参见AngularJS：重用具有不同父级的组件。

• 不推荐，但另一种选择：使用 $rootScope 而不是服务：将 $rootScope 注入两个指令。让第一个指令修改 $rootScope 上的对象属性。另一个指令 $watches 该对象属性。