Доступ к глобальным объектам с угловым

Question

Я хочу знать, как лучше всего получить доступ к глобальным объектам и генерировать некоторые события этих объектов в приложениях Angular App, таких как (окно, локальное хранилище, документ или любая другая цель)

, и правильно ли это вызыватьэто как объект JS или я должен придерживаться углового способа сделать это?

и если мне не разрешено манипулировать DOM с какой-либо другой библиотекой, такой как jQuery, в угловом приложении?

Answer 1

Я бы посоветовал следующее:

Не обращаться к объекту документа для манипуляций с DOM или использовать JQuery.Сам Angular предоставляет все методы, необходимые для манипулирования DOM.Использование Angular и JQuery вместе было бы антипаттерном (IMO).

Вот некоторые инструменты в Angular, которые позволяют вам манипулировать DOM:

1. Синтаксис шаблона , Для динамического вывода html текста
2. NgClass , для динамического добавления строк
3. * директива NgIf , для условного отображения определенных элементов DOM
4. Renderer2 , для выполнения всех видов манипуляций с DOM.

Такие вещи, как localalstorage и sessionstorage, вы можете получить прямой доступ из своего углового приложения.

Для хранения ваших глобальных данных я бы посоветовал вам использовать сервисы, которые позволяют компонентам легко обмениваться данными друг с другом.

Конечно, теоретически вы можете добавить jQuery или другую библиотеку для манипулирования DOM, ноэто побеждает всю цель использования Angular в первую очередь.Поскольку мы хотим использовать Angular для создания приложения SPA относительно простым способом.

Answer 2

Наиболее распространенным способом является использование сервисов для отслеживания объектов вокруг приложения.Везде, где вы хотите получить доступ к некоторым данным, вы просто внедряете соответствующую услугу.Вы можете узнать больше об услугах здесь: https://angular.io/tutorial/toh-pt4

Когда дело доходит до манипулирования DOM, Angular имеет свои собственные функции для связи с DOM.Например, вы можете манипулировать DOM, используя встроенный Renderer2.Вы также можете получить доступ к nativeElement некоторой ссылки на элемент.Не рекомендуется обновлять DOM вручную с помощью Vanilla JS или jQuery.

Renderer2: https://angular.io/api/core/Renderer2

ElementRef: https://angular.io/api/core/ElementRef