View encapsulation и другие опции компилятора

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

platformBrowserDynamic().bootstrapModule(AppModule);

Continue reading

Новое в Angular4.3

  • HttpClient – принципиально новый клиент, который переехал из отдельного модуля в подсекцию common (‘@angular/common/http‘):
    • позволяет получить данные сразу в JSON
    • типизировать возвращаемые данные вывод
    • появляются интерсепторы
    • задание дефолтных заголовков (например токена авторизации)
    • подписаться события прогресса
  • Новые гарды роутера: GuardsCheckStart, GuardsCheckEnd, ResolveStart, ResolveEnd, NavigationStart
  • Опция для отключения анимации в детях
  • Специальный CSS селектор ::ng-deep, который является альтернативой >>>

Angular: Что такое forwardRef?

Мы иногда встречаем в коде:

и сразу не понятно, что это магическая функция forwardRef. На самом деле все просто: forwardRef – это функция-обертка. Зачем она нужна? Чтобы мы могли задавать значением свойства сущности, которые объявлены ниже (иначе будет ошибка):

Также можно глянуть в исходники, и убедиться что это просто метод-обертка:

Формы и валидация данных в Angular

В отличии от AngularJS в Angular сделали целый модуль, который помогает в обработке форм.

Angular предлагает 2 подхода работы с формами:

  • основанный на шаблонах (template-driven)
  • реактивный (reactive)

Шаблонный более традиционный для декларативного подхода фреймворка. Реактивный появился позже и считается более прогрессивным и гибким. Мы разберем оба подхода.

Continue reading

Запускаем Angular виджет в приложение без Angular

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

Continue reading

Что нового в Angular 4.2

  • оператор не нулевого присвоения ( Non-null assertion operator ) теперь можно использовать в шаблонах:

    <h2>{{ user!.name }}</h2>
  • очень много изменений по анимации (смотрите в отдельном посте)
  • добавили поддержку mix & max стандартных валидаторов (но уже в 4.3.0-beta.0 удалили эту возможность признав как breaking change)
  • в тестах появились 3 вспомогательных метода:
    • TestBed.overrideProvider()приближает возможность тестировать в AOT,
    • flush() – для сбрасывания всех счетчиков и выполнения колбэков всех асинхронных операций,
    • fixture.whenRenderingDone() – возвращает промис, который ждет выполнения всех анимаций