Angular - уникальная идентификация элемента в рекурсивном ng-контенте - PullRequest
Новая
       46

Angular - уникальная идентификация элемента в рекурсивном ng-контенте

1 голос
/ 07 июня 2019

У меня есть пользовательский компонент, называемый «сплиттер», этот шаблон включает в себя элемент ng-content, который должен поддерживать себя как допустимый контент.

splitter.component.html: 

<div #container>

  <div>
    <ng-content select="[a]"></ng-content>
  </div>

  <div>
    <ng-content select="[b]"></ng-content>
  </div>

</div>

Шаблон с использованием сплиттера: 

<app-splitter>

  <app-splitter a>
  </app-splitter>

  <div b>
  </div>

</app-splitter>

Когда я пытаюсь получить высоту div 'контейнера' данного сплиттера, в splitter.component.ts: 

@ViewChild('container') container: ElementRef;
...
console.log(this.container.nativeElement.offsetHeight)

похоже, что я всегда получаю ссылку на «контейнер» самого высокого уровня. Другими словами, одно и то же значение печатается для каждого экземпляра сплиттера, хотя я подтвердил, что высота визуально различна и в инструментах разработчика Chrome.

Есть ли способ идентифицировать контейнер, уникальный для данного сплиттера?

...