angular - angular2 获取非子组件的 elementRef

Question

在我的应用程序中，我具有以下结构：

<fin-header></fin-header>
<main></main>
<fin-footer></fin-footer>

在标题中，我想将滚动添加到main. 我的滚动方法作为参数elementRef。但我不能得到一个，@ViewChild因为组件main不是标题的孩子。

有没有机会获得elementRef不是孩子的组件？

Answer 1

也许您可以稍微修改一下您的结构并将您的组件嵌入到父级中。就像是：

<parent>
  <fin-header [elementRef]="mainRef"></fin-header>
  <main></main>
  <fin-footer></fin-footer>
<parent>

这样，父级可以将其子级（主）的引用传递给其另一个子级（标题）。

Answer 2

您可以获取mainelementRef 并用于nativeElement.parentElement获取父级并从父级对 DOM 进行另一个查询。例如，如果结构类似于：

<div>
  <fin-header></fin-header>
  <main></main>
  <fin-footer></fin-footer>
</div>

获得main'selementRef nativeElement.parentElement将是 div。当然，div.querySelectorAll会拥有所有 div 的孩子。