Просмотр и изменение состояния компонента Angular в DevTools
Инспектор состояния Angular, разработанный Антоном Луневым, является расширением браузера Firefox, которое открывает внутренности приложений Angular для отладки и инспекции. Приложение отображает свойства компонентов, хранилища управления состоянием и дерево компонентов внутри инструментов разработчика браузера, чтобы разработчики могли инспектировать и редактировать состояние в реальном времени. Оно поддерживает NgRx, NGXS и Akita, обрабатывает AngularJS через современный Angular в гибридных приложениях и интегрируется с консолью. Предназначено для разработчиков Angular, которые отлаживают сложное состояние и миграции.
Для чего используется инспектор состояния Angular?
Этот инструмент интегрируется в инструменты разработчика браузера и предоставляет данные на уровне компонентов, позволяя проводить инспекцию в реальном времени и редактировать на месте свойства компонентов и хранилища состояния. Он представляет дерево компонентов и позволяет разработчикам выбирать элементы для просмотра связанных данных, а также предоставляет выбранный компонент в консоль через глобальную переменную, такую как $scope или $ctrl. Типичные задачи отладки включают:
отслеживание потока данных между компонентами
редактирование свойств для наблюдения за немедленными изменениями в пользовательском интерфейсе
Какие языки программирования и библиотеки состояния он поддерживает?
Нацеленный на экосистему Angular, приложение явно поддерживает устаревший AngularJS, а также Angular 2 и последующие версии Angular, так что команды, которые поддерживают старый код или мигрированные модули, могут использовать один и тот же инспектор. Он обеспечивает прямую интеграцию с библиотеками управления состоянием, в частности NgRx, NGXS и Akita, так что разработчики могут просматривать снимки хранилища вместе с состоянием компонентов, не устанавливая отдельные инструменты для каждой модели.
Подходит ли он для разработчиков, работающих над сложными или гибридными проектами Angular?
Расширение нацелено на веб-разработчиков и программистов, сосредоточенных на миграциях Angular и отладке состояния; оно поддерживает гибридные настройки AngularJS плюс современные и доступно для браузеров Firefox и на основе Chromium. Проект является открытым исходным кодом на GitHub и поддерживается Антоном Луневым, а отзывы сообщества положительные. Эта комбинация делает инструмент подходящим для команд, которые принимают рабочие процессы на основе расширений и предпочитают видимый исходный код и обсуждение в сообществе.
Практичный выбор для инженеров Angular с компромиссом по обслуживанию
Этот инструмент подходит для отдельных разработчиков и небольших команд, которые полагаются на отладку в браузере и утилиты, поддерживаемые сообществом, так как это расширение с открытым исходным кодом, поддерживаемое одним независимым разработчиком. Команды предприятий, которым требуются гарантированные графики обновлений или формальная поддержка, должны рассматривать его как вспомогательное средство для инспекции, а не как основную зависимость. Проверьте расширение на сборке для тестирования и ознакомьтесь с репозиторием проекта перед интеграцией его в стандартные процедуры отладки.
Pros
Инспекция в реальном времени и редактирование свойств компонентов на месте
Поддерживает NgRx, NGXS и Akita хранилища
Обрабатывает гибридные приложения AngularJS и современные приложения Angular
Интеграция консоли предоставляет выбранный компонент через $scope или $ctrl
Cons
Поддерживается одним независимым разработчиком, что может повлиять на поддержку
Требуется рабочий процесс на основе DevTools; нет отдельного приложения инспектора
Законы, касающиеся использования этого программного обеспечения, варьируются от страны к стране. Мы не поощряем и не одобряем использование этой программы, если она нарушает эти законы. Softonic может получить реферальное вознаграждение, если вы перейдете по ссылке или купите и продукты, представленные здесь.
