Как получить идентификатор выбранной вкладки и ссылку на элемент в angular 8

Question

Я пытаюсь получить ссылку на элемент выбранной вкладки, но не работает, как неопределенный. Я не знаю, почему я так получаю. На самом деле я хочу получить имя ссылки выбранного элемента вкладки, как для ссылки на первый элемент вкладки, это tab1, так что если я щелкаю первую вкладку и хочу получить идентификатор вкладки и ссылку на элемент. Пример, если я щелкаю предупреждение первой вкладки, должно быть «Идентификатор этой вкладки = mytab1, а ссылка на элемент = = tab1»

Как это сделать? Если кто-нибудь знает, пожалуйста, помогите найти решение.

app.component. html:

    <my-tabs (selectedTabClick)="test($event)">
      <my-tab [tabTitle]="'Tab 1'"  id="mytab1" #tab1>
        Tab 1 content
      </my-tab>
      <my-tab tabTitle="Tab 2" id="mytab2" #tab2>
        Tab 2 content
      </my-tab>
    </my-tabs>

Демонстрация: https://stackblitz.com/edit/angular-tabs-example-egszd2?file=app / app.component. html

Answer 1

Внутри app.component.ts, измените метод test следующим образом:

test(event): void {
    console.log(event.data);
    alert("This tab id is " + event.data.id + " and element reference is " + event.data);
}