Как вы вызываете метод дочернего компонента, когда родительский элемент *ngForing один экземпляр

У меня есть компонент всплывающей подсказки, который использует проекцию контента и позиционирует себя после загрузки страницы (в методе ngOninit)

tooltip.component.html

<div id='container' class='container flex-container'>
  <ng-content></ng-content>
  <span id='tooltip' class='tooltip flex-container'>{{description}}</span>
</div>

tooltip.component.ts

@Component({
 selector: 'app-tooltip',
 // Omitted for brevity ...
})
export class TooltipComponent implements OnInit {
  @Input() description: string = 'Some Description';
  @ContentChild('element') element;

    // constructor & ngOnInit

  ngAfterContentInit(): void {
    this.position();
  }

  position = () => {
    //  omitted for brevity ...
  }
 }

Он используется другим компонентом вместе с * ngFor.

another.component.html

    <app-tooltip *ngFor='let filter of filters' [description]='filter'>
      <app-drop-down-button>{{filter}}</app-drop-down-button>
    </app-tooltip>

Проблема в том, что позиционируется только одна всплывающая подсказка. На всех остальных их метод позиционирования не влияет. Я хочу, чтобы все они располагались в соответствии с их методом позиционирования.

Мы ценим любые предложения. Заранее спасибо.

0 ответов

Другие вопросы по тегам