25 июля вышел Angular 6.1. Данный минорный релиз фреймворка можно рассматривать как замену Angular 6.0, включающую в себя некоторые новшества и исправления ошибок. Этот материал, перевод заметки из блога Angular, посвящён основным новым возможностям Angular 6.1.



Маршрутизатор и сохранение позиции прокрутки


Теперь разработчики Angular-приложений могут воспользоваться новой возможностью маршрутизатора, которая позволяет запоминать и восстанавливать местоположение пользователя на странице — позицию прокрутки или скроллинга. При переходе на очередную страницу приложения позиция скроллинга сбрасывается, при этом запоминается положение пользователя на предыдущей странице. Нажатие на кнопку «Назад» приводит к открытию предыдущей страницы с учётом сохранённой позиции прокрутки.

Для того чтобы включить эту возможность, можно воспользоваться следующей командой:

RouterModule.forRoot(routes, {scrollPositionRestoration: 'enabled'})

Ожидается, что в будущем мажорном релизе платформы маршрутизатор по умолчанию будет настроен на восстановление позиции скроллинга.

ShadowDOM v1 и View Encapsulation


Существует множество способов связывания CSS-правил с компонентами, в которых определены эти правила. Это называется View Encapsulation. Инкапсуляцию можно переключить на использование ShadowDOM v1 в декораторе компонента. Делается это так:

@Component({
  templateUrl: './my-component.html',
  encapsulation: ViewEncapsulation.ShadowDom
})
export class MyComponent { }

Теперь применение значения ViewEncapsulation.Native, которое означает использование Shadow DOM v0, признано устаревшим.

ShadowDOM v1 отличается лучшей кросс-браузерной поддержкой, чем предыдущая версия стандарта. Работа над этим стандартом изначально велась с учётом возможности его использования в различных браузерах. О различиях Shadow DOM v0 и v1 можно почитать здесь.

Новшества ShadowDOM v1 будут интересны, в основном, авторам библиотеки и продвинутым разработчикам. Надо отметить, что применение Shadow DOM v1 необходимо для использования проецирования контента (content projection) в рамках технологии Angular Elements.

Объединение правил Schematics в цепочки


В этом релизе были улучшены возможности инструмента Schematics, в результате теперь из существующего правила можно возвращать новое правило. Это позволяет разработчикам более гибко определять набор правил для Schematics.

Поддержка TypeScript 2.9


Теперь Angular, наряду с TypeScript 2.7, поддерживает TypeScript 2.8 и 2.9. Одна из важных возможностей TS 2.9, которая пригодится многим разработчикам, имеет отношение к ошибкам, к таким, как следующая:

Exported variable ‘x’ has or is using name ‘y’ from external module ‘z’ but cannot be named

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

Итоги


В новом релизе Angular есть и другие изменения, например, касающиеся обработки неправильно сформированных URL (malformedUriErrorHandler) и направленные на улучшение работы с ассоциативными массивами и объектами (KeyValuePipe). Вышла и новая версия angular-cli.

Angular 6.1 является последним запланированным минорным релизом версии 6.x. Поэтому, в обозримом будущем, можно ожидать выхода бета-версий Angular 7.0 и появления в этом фреймворке новых интересных возможностей.

Уважаемые читатели! Какие новшества Angular 6.1 кажутся вам наиболее интересными? Чего вы ждёте от Angular 7.0?

Комментарии (2)


  1. devpreview
    31.07.2018 20:44
    +1

    новой возможностью маршрутизатора, которая позволяет запоминать и восстанавливать местоположение пользователя на странице — позицию прокрутки или скроллинга

    Когда писал первое приложение на Angular, был очень удивлён, что не было этой возможности «из коробки».


  1. KhodeN
    01.08.2018 16:33

    Чего вы ждёте от Angular 7.0?

    Однозначно ivy — новый компактный движок рендеринга, который позволит в разы сократить размер бандла.