Как в коде компонента Angular узнать название селектора этого компонента?

Question

[Drovosek01]

Например есть такой компонент.

@Component({
  selector: 'app-test',
  templateUrl: './app-test.component.html',
  styleUrls: ['./app-test.component.scss']
})
export class Test {

}

Как в коде, в классе Test узнать значение поля selector, т.е. получить строку 'app-test' в данном случае?

Answer 1

[Sun_Day]

@Component({
  selector: 'app-test',
  templateUrl: './app-test.component.html',
  styleUrls: ['./app-test.component.scss']
})

export class Test {
  constructor(element: ElementRef<HTMLElement>) {
    const tagName = element.nativeElement.tagName.toLowerCase();
  }
}

Comments

[Drovosek01]

А где вы такие свойства у nativeElement нашли? У меня VSCode показывает, что у него нет ни свойств не методов:

[Sun_Day]

Drovosek01, nativeElement вернет dom элемент.
tagName- html тег в виде строки.

[Антон Швец]

Drovosek01, у вас их нет, потому что ElementRef это дженерик, укажите ElementRef<HTMLElelement> и появятся

[Drovosek01]

Sun_Day, вопрос был в том, почему IDE мне не подсказывает.

[Drovosek01]

Sun_Day, добавьте типизацию в пример вашего кода, чтобы я мог отметить его решением.

[Sun_Day]

Drovosek01, вопрос был
А где вы такие свойства у nativeElement нашли?

Читал документацию.
Вообще, я это не за пк смотрю, так что в случае возникновения таких вопросов можно зажать ctrl + лкм(vscode) и перейти в модуль, где задекларировано что вам нужно и посмотреть всю типизацию.

Добавил.