angular2 получить elementRef компонента, который не является дочерним

Question

В моем приложении есть следующая структура:

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

В заголовке я хочу добавить прокрутку к определенному компоненту main.Мой метод прокрутки принимает в качестве аргумента elementRef.Но я не могу получить один на @ViewChild, потому что компоненты main не являются потомками заголовка.

Есть ли шанс получить elementRef компонента, который не является дочерним?

Answer 1

вы можете получить main elementRef и использовать nativeElement.parentElement, чтобы получить родителя и выполнить другой запрос на DOM от родителя.например, если структура выглядит примерно так:

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

Получение main s elementRef nativeElement.parentElement будет div.и, конечно же, div.querySelectorAll будет иметь всех детей div.

Answer 2

Возможно, вы могли бы немного изменить свою структуру и встроить компоненты в родительский элемент.Примерно так:

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

Таким образом, родительский объект может передать ссылку своего дочернего элемента (основного) другому дочернему элементу (заголовку).