Angular 7 на подходе

Angular 7 на подходе

От автора: сегодня Angular Team выпустили бета-версию Angular 7. Многим из нас будет интересно узнать о функциях и исправлениях ошибок, которые мы можем увидеть в этой бета-версии.

Функции

Давайте сначала рассмотрим новые функции.

Angular Compatibility Compiler (ngcc)

Этот компилятор преобразует node_modules, скомпилированный с помощью ngc, в node_modules, который, выглядит, как скомпилированный с помощью ngtsc. Это преобразование позволит использовать такие «унаследованные» пакеты с помощью движка рендеринга Ivy.

DoBootstrap

Новый интерфейс привязки жизненного цикла ngDoBootstrap. Пример:

Компилятор

Обновлены заполнители XMB (<ph>) с включением исходного значения поверх примера. Теперь заполнители могут по определению иметь один пример (<ex>) и текстовый узел. Текстовый узел используется TC как «оригинальное» значение из заполнителя, в то время как пример должен представлять фиктивное значение. Давайте рассмотрим это подробнее:

Старое поведение:

Сообщение наподобие этого <foo>Band: {{yourName}}</foo> генерирует это xmb-сообщение:

Новое поведение:

Сообщение наподобие этого <foo>Band: {{yourName}}</foo> генерирует это xmb-сообщение:

<Ph> PCDATA (текстовый узел) используется TC для некоторых валидаций.

Исправление ошибок

Bazel

Теперь используется compile_strategy(), чтобы решить, следует ли составлять код Angular с помощью ngc (унаследованный) или ngtsc (локальный). Чтобы правила g3 BUILD правильно переключались и позволяли тестировать Ivy в g3, compile_strategy() стал importable.

Ivy

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

Пример:

До:

После:

TView.components больше не отслеживают индексы директив (только индексы элементов хоста). Мы можем сократить массив компонентов вдвое, потому что контекст для компонентов теперь хранится в экземпляре компонента LViewData и к нему можно получить доступ.

Теперь у нас есть новая инструкция, reference() (r ()). Раньше мы использовали закрытие, чтобы получить доступ к локальным refs в родительских представлениях. Теперь, когда вложенные функции шаблона являются плоскими; они не имеют доступа к локальным refs через закрытие, поэтому нам нужен другой способ прохождения дерева представлений. reference принимает уровень вложенности, а локальный индекс ref затем просматривает дерево представлений, чтобы найти нужное представление, из которого можно загрузить локальный ref.

До:

После:

Ядро

Теперь Angular лучше обрабатывает ошибки для @Output, если свойство не инициализировано.

Автор: Valentyn Yakymenko

Источник: //itnext.io/

Редакция: Команда webformyself.

Метки:

Похожие статьи:

Комментарии Вконтакте: