Привет, Хабр! Я Святослав Зайцев, занимаюсь разработкой Angular-приложений и внутренних библиотек компонентов в Т-Банке.

Недавно в Angular v22 появилось изменение, которое прошло почти незаметно на фоне более громких новинок. Тем не менее оно снимает одно из ключевых ограничений Directive Composition API.

Если вы используете hostDirectives для переиспользования поведения между директивами и компонентами, то могли сталкиваться с ситуациями, когда вполне логичная композиция внезапно заканчивалась ошибкой NG0309.

В статье разберем, почему так происходило раньше, что изменилось в Angular v22 и как новый механизм дедупликации host directives влияет на архитектуру компонентов и дизайн-систем.

В современных Angular-приложениях сигналы предоставляют мощный способ управления реактивными потоками данных. Однако по мере роста сложности приложений становится всё более важным поддерживать чистоту функций, которые взаимодействуют с сигналами. Реактивная чистота гарантирует, что функции не создают нежелательных побочных эффектов, регистрируя новых производителей в реактивном графе.

В последних версиях Angular появилась функция inject(), предназначенная для внедрения зависимостей. Эта функция может быть вызвана только в рамках Injection Context.

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

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