javascript - 将此jQuery功能封装到angular指令中的最佳方法？

我在AngularJS中工作，试图将内容封装到指令中。我需要使用jQuery来实现一些滚动功能。当div仅部分可见时，我希望父div的子按钮保持固定在屏幕底部。我想放入Angular中的Here's a jsfiddle。

这是HTML(在jsfiddle中也可以查看):

<div class="spacer">spacer div - scroll down</div>
<div id="parent">
    parent div content
    <div id="childContainer">
        <button id="child" style="">Test Button</button>
    </div>
</div>
<div class="spacer">spacer div - scroll up</div>

我试图避免在Angular中使用ID选择器(我认为它们对指令不利)。到目前为止，我已经通过在元素上使用属性指令并将元素存储在指令的链接函数中来完成此操作。当指令不需要编写自己的HTML时，此方法可以很好地工作。如果我在attribute指令中编写HTML，它将覆盖父级的HTML。

但是，在这种情况下，我需要attribute指令包含一个按钮。如果我为按钮编写了HTML，它将删除我 parent 的HTML。

所以问题是我不能使用属性指令在Angular中获取父元素。

我可能会走错路了，但是我希望有更多Angular经验的人能够理解我的思维过程，并为我指明正确的方向？

最佳答案

您可以使用jQuery找到父对象，这将使其变得更容易。
将parentsUntil()方法与父类一起使用。