Angular 2 проверяет видимость элемента

#angular #components #element #visibility

#angular #Компоненты #элемент #видимость

Вопрос:

Как я могу проверить, виден ли элемент (или компонент) на экране?

В конкретном случае у меня есть компонент внутри раскрывающегося списка начальной загрузки, и я хочу, чтобы мой компонент что-то делал, только если раскрывающийся список открыт (но я не хочу использовать ссылку на элемент выпадающего списка).

Ответ №1:

Я бы использовал ng-bootstrap, если вы еще этого не сделали, и, в частности, компонент NgbDropdown.

https://ng-bootstrap.github.io/#/components/dropdown

У него есть событие openChange, которое срабатывает при открытии или закрытии меню, и вы можете прослушать это событие и запустить свою собственную логику.

Он также имеет метод isOpen, который вы можете проверить, открыто ли меню или нет.

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