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

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

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

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

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


angular elementref
person Michał Frąk    schedule 21.12.2018    source источник
comment
Я думаю, вы могли бы использовать родительский элемент для передачи elementRef основного в заголовок. Можете ли вы добавить свойство вывода в main, которое является elementRef, и свойство ввода в заголовке того же типа, а затем в родительском элементе установить одно как другое в AfterViewInit?   -  person Greg Kopp    schedule 21.12.2018

Ответы (2)


arrow_upward
0
arrow_downward

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

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

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

person Dylan Watson    schedule 21.12.2018

arrow_upward
0
arrow_downward

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

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

Получение main elementRef nativeElement.parentElement будет div. и, конечно же, у div.querySelectorAll будут все дочерние элементы div.

person dK-    schedule 21.12.2018